.navbar-default {
    background-color: #f8f8f8;
    border-color: #e7e7e7;
}
.navbar-default .navbar-brand {
    color: #777;
}

.mr-0{
    margin-right: 0px;
}
.ml-0{
    margin-left: 0px;
}
.pr-0{
    padding-right : 0px;
}
.pl-0{
    padding-left : 0px;
}


.custom-accordion-header {
    background-color: #6495ed; /* Change background color */
    color: #fff; /* Change text color */
  }
  
  .custom-accordion-header:hover {
    background-color: #6495ed; /* Change hover background color */
  }
  
  .custom-accordion-body {
    background: linear-gradient(rgb(216, 216, 216), rgb(230, 230, 230));
    background-color: #f8f9fa; /* Change body background color */
    color: #212529; /* Change body text color */
  }

.accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #6495ed;
}

.accordion-item .accordion-button{
    padding: 10px;
}

.accordion-item .accordion-body{
    padding: 2px 1px 1px 1px;
}


a:hover {
    text-decoration: none;
}

a:hover {
    color: none;
}


#heiLtd {
	max-height: 300px;
	overflow-y: scroll;
	overflow: auto;
}

.blink {
  animation: blinker 0.8s step-start infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}


sup {
    top: -.5em;
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
    font-family: roboto condensed;
}

.vacNameG {
	text-align: center;
}

.vacRate {
	font-size: 12px;
    font-family: Roboto,sans-serif!important;
    font-weight: 600;
}

.vCenterAdd {
	font-size: 12px;
}

.vCenterAdd1 {
	font-size: 12px;
}

.vCenterAdd2 {
	font-size: 12px;
	text-align: center;
}

.vCenterAdd1:hover {
	text-decoration: underline;
	cursor: pointer;
}

.vCenterName {
	color: #dc5507;
	font-weight: 600;
}

.vacFree {
  background-color: green;
  padding: 2px;
  border-radius: 4px;
  color: white;
} 

.vacPaid {
  background-color: #0d76b3;
  padding: 2px;
  border-radius: 4px;
  color: white;
} 

/* Style the tab */
.tab {
  overflow: hidden;
  background-color: #0f82d4;
  color: fff;
  
}

/* Style the buttons inside the tab */
.tab button {
  background-color: #0f82d4	;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 5px 5px;
  transition: 0.3s;
  font-size: 15px;
  color:#fff
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #0f82d4;
}

/* Create an active/current tablink class */
.tab button.active {
  /*background-color: #ccc;*/
  background-color: #13a019;
    color: white;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  
  border-top: none;
}


/*.borderless>tbody>tr>td,
.borderless>tbody>tr>th,.borderless>tfoot>tr>th,
.borderless>tfoot>tr>td,.borderless>thead>tr>th,
.borderless>thead>tr>td {
	padding: 2px;
	border-top: none;
	padding-left: 10px;
	
}

.borderless {
	margin-bottom: 8px;
}*/

.crimson {
	color: crimson;
}

.blue {
	color: blue;
}

.sessionDetails {
	border: 1px solid #ccc;
}

/*
.listDetails {
  border: 1px solid black;
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 5px;
  width: 100%;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  overflow-x: scroll;
  overflow: auto;
}*/

.accordion:hover {
  background-color: #ccc;
}
#next7Days{
	float:right;
	padding:4px 6px
}
#pre7Days{
	float:left;
	padding:4px 6px
}
.panel {
  /*padding: 0 18px;*/
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99999999; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}


/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 70%;
  max-height:500px;
  overflow-y:scroll;
  overflow-x: scroll;
 
}
.modal-content::-webkit-scrollbar {
    /*display: none;*/
}
/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
.button {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 15px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 4px;
}
.modal-heading{
  border: none;
  color: black;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 28px;
  margin: 4px 2px;
  padding:8px;
  cursor: pointer;
}

#closeButton {
    position: absolute;
    top: 0;
    right: 0;
}
#statusfooter {
	position: fixed;
	width:100%;
	bottom: 20px;
	height: 20px;
	clear: both;
	z-index: 6000;
}
.olControlStatusBarWrapper
{
	position: fixed;
	width:100%;
	bottom: 5px;
	height: 20px;
	clear: both;
	z-index: 6000;	
}
#footer {
		position: fixed;
		width:100%;
		bottom: 0;
		height: 20px;
		clear: both;
		z-index: 6000;
	}
.pinTable {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #ddd;
}

.pinTable td{
	width:10%;
	text-align:center;
	
}
.booked{
	background-color: #d61607;
    padding: 3px;
	margin:3px;
    color: #fff;
    font-weight: 600;
}
.availVax{
	display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: stretch;
	padding:8px;
	
}
.dose1{
	padding:6px;
	border:1px solid #ddd !important;
	background-color: #fffbe5 ;
	font-weight: 600;
}
.dose2 {
	padding:6px;
	border:1px solid #ddd !important;
	background-color:#eafffe;
	font-weight: 600;
}
.total{
	padding: 8px;
	background-color: #f59507;
    color: #fff;
    font-weight: 600;
	text-align:center;
	padding-top:16px;
	}


  #accordionExample table tr td:hover{background-color:#ecf1f5;}


.belowheader .card {
    background-color: #fff;
    border-radius: 10px;
    border: none;
    position: relative;
    margin-bottom: 8px;
    /* height: 72px; */
    box-shadow: 0 0.46875rem 2.1875rem rgba(90,97,105,0.1), 0 0.9375rem 1.40625rem rgba(90,97,105,0.1), 0 0.25rem 0.53125rem rgba(90,97,105,0.12), 0 0.125rem 0.1875rem rgba(90,97,105,0.1);
}


.belowheader .l-bg-blue-dark {
    background: linear-gradient(to right, #444b5d, #3976e6) !important;
    color: #fff;
}

.belowheader .l-bg-blue-thin {
  background: linear-gradient(to right, #444b5d, #3976e6) !important;
  color: #fff;
}

.card-title{
  max-width: 326px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.belowheader .card-title:hover {
  /* overflow: visible; */
}

.countArea{
  font-size: medium;
}


#bar-chart-div {
  background-color: #e8d0b8;
}

#bar-chart-div svg {
  width: 100%;
  height: 290px;
}


#bar-chart-div text {
  font-size: 12px;
  fill: #090909;
  font-weight: bold;
}

#bar-chart-div path {
  stroke:  #090909;
}

#bar-chart-div line {
  stroke: #090909;
}

#bar-chart-div line#limit {
  stroke: #e64d10;
  stroke-width: 3;
  stroke-dasharray: 3 6;
}

#bar-chart-div .grid path {
  stroke-width: 0;
}

#bar-chart-div .grid .tick line {
  stroke:  #090909;
  stroke-opacity: 0.3;
}

#bar-chart-div text.divergence {
  font-size: 14px;
  fill: #2F4A6D;
}

text.value {
  font-size: 14px;
}

#bar-chart-div text.title {
  font-size: 22px;
  font-weight: 600;
}

#bar-chart-div text.label {
  font-size: 14px;
  font-weight: 400;
}

#bar-chart-div text.source {
  font-size: 10px;
}

#categeory-wise-count ul {
  padding: 0px;
}
#categeory-wise-count ul li {
  font-size: 14px;
  float: left;
  list-style: inside;
}
#categeory-wise-count ul li #centerType {
  color: black;
  font-size: 10px;
  font-weight: 400;
}
#categeory-wise-count ul li #centerCount {
  color: black;
  font-size: 10px;
}



@media (max-width: 767px) {
	#live {
		top: 200px;
		width: 350px;
		left: 15px;
	}
}

@media (min-width: 768px)and (max-width: 1023px) {
	#live {
		top: 331px;
		width: 319px;
		left: 34px;
	}
}

@media (min-width: 1024px)and (max-width: 1279px) {
	#live {
    top: 324px;
    width: 198px;
		left: 33px;
	}
}

@media (min-width:1280px) {
	#live {
		top: 279px;
		width: 240px;
		left: 35px;
	}
}


* { box-sizing: border-box; }
body {
  font: 16px Arial;
}
.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
}
input {
  border: 1px solid transparent;
  background-color: #f1f1f1;
  padding: 10px;
  font-size: 16px;
}
input[type=text] {
  background-color: #f1f1f1;
  width: 100%;
}
input[type=submit] {
  background-color: DodgerBlue;
  color: #fff;
}


.chosen-container
{
	width : 100%!important;
}

/* Prevent background color change on hover */
td:hover {
    background-color: inherit !important;
    color: inherit !important;
    cursor: default !important;
}

/* Prevent any transition effects */
td {
    transition: none !important;
}

/* Flexbox table styling */
.table-container {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

td, th {
    padding: 8px;
    /*border: 1px solid #ddd;*/
}

@media screen and (max-width: 1220px) {
    .table-container {
        display: block;
        overflow-x: auto;
    }

    table {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    tbody, thead {
        display: block;
    }

    thead {
        flex: 0 0 auto;
    }

    tbody {
        overflow-y: auto;
        height: 200px; /* Adjust based on your needs */
        flex: 1 1 auto;
    }

    tr {
        display: flex;
        flex-direction: column;
    }

    td {
        display: block;
        width: 100%;
    }
}


/* Linear indeterminate progress indicator styles */
/* Styles for the reusable progress bar */
#progress-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Centers the container horizontally and vertically */
  display: none; /* Hidden by default */
  width: 200px;
  background-color: lightgray;
  height: 4px;
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: 10px;
  z-index: 1000; /* Ensures it appears above other elements */
}

#indeterminate-progress-bar {
  height: 100%;
  background-color: var(--color-primary);
  width: 100%;
  transform-origin: left;
  animation: indeterminate-progress 1s infinite linear;
  border-radius: 2px;
}


.custom-table{
    border: 2px solid #6495ed; /* Set the border color and width */
    border-radius: 5px; /* Optional: For rounded corners */
    overflow: hidden; /* Optional: To prevent content from overflowing */
}

.tabulator-header .tabulator-col {
    border-bottom: 2px solid #6495ed; /* Border under the header cells */
}

/* Add border to the table data cells */
.tabulator-table .tabulator-cell {
    border-right: 1px solid #6495ed; /* Border to the right of each cell */
}

/* Add border to the last column cells to avoid double borders */
.tabulator-table .tabulator-cell:last-child {
    border-right: none; /* Remove the right border from the last column */
}

/* Optional: Add some spacing between the rows for better visibility */
.tabulator-row {
    border-bottom: 1px solid #6495ed; /* Border between rows */
}

.tabulator-header .tabulator-col {
    border-bottom: 2px solid #6495ed; /* Border under the header cells */
}

/* Add border to the table data cells */
.tabulator-table .tabulator-cell {
    border-right: 1px solid #6495ed; /* Border to the right of each cell */
}

/* Add border to the last column cells to avoid double borders */
.tabulator-table .tabulator-cell:last-child {
    border-right: none; /* Remove the right border from the last column */
}

/* Optional: Add some spacing between the rows for better visibility */
.tabulator-row {
    border-bottom: 1px solid #6495ed; /* Border between rows */
}

#mousePosition {
    bottom: 0;
    left: 0;

    width: 100%;
    height: 25px;

    background-color: #e0e0e0;   /* grey background */
    color: #000;

    font-size: 12px;
    line-height: 25px;

    padding-right: 10px;
    box-sizing: border-box;

    text-align: right;          /* float text to right */
    z-index: 1000;
}