body {
	  font-size: 100%;
	  height: 100%;
	  min-height: 100vh;
	  margin: 0;
	}

	h2 {
	  font-size: clamp(1.5rem, 4vw, 2.5rem);
	}

	h3 {
	  font-size: clamp(1rem, 2vw, .5rem);
	  color: red;
	}

	a {
	  color: black;
	  text-decoration: none;
	}

	hr {
	  height: 4px;
	  border: solid;
	  color: #7a94b8;
	  width: 100%;
	}


	.fullpage {
	  height: 100vh;
	  display: flex; 
	  flex-direction: column;	  
	  justify-content:flex-start; 
	  align-items:center; 
	  vertical-align:top;
	  width:100%;
	}

	.grid-container {
	  display: grid;
	  grid-template-columns: 1fr 1fr;
	  grid-gap:20px;
	  padding-top:10px;
	  padding-bottom:10px;
	  background-color:#DAE9F0;
	  border-bottom: 4px solid #7a94b8;
	  
	  }
	
	.grid-child {
	}

	.div-container {
		display: flex;
		flex-wrap: wrap;
		margin-top: -100px;
		grid-gap: 10px;
		padding-left: 15px;
		padding-right: 15px;
		
	}
	
	.div-child {
		flex: 1;
		width: 400px;
		min-height: 300px;
		overflow-y: auto;
	  	background-color:#EEF4F7;
		border: 4px solid #7a94b8;
		border-radius: 10px;
		padding: 10px;

	}

	.div-callContainer {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		flex-wrap: wrap;
		margin-top: -100px;
		grid-gap: 10px;
		padding-left: 15px;
		padding-right: 15px;		
	}

	.callLogForm {
		flex: 1;
		width: 500px;
		min-height: 500px;
		overflow-y: auto;
	  	background-color:#EEF4F7;
		border: 4px solid #7a94b8;
		border-radius: 10px;
		padding: 10px;
		box-sizing: border-box; 
	}

	.callLogList {
		flex: 3;
		width: 1000px;
		min-height: 500px;
		overflow-y: auto;
	  	background-color:#EEF4F7;
		border: 4px solid #7a94b8;
		border-radius: 10px;
		padding: 10px;
		box-sizing: border-box; 
	}

	.tile-title {
		font-weight: bold;
		font-size: 1.5em;
		
	}


	.clbody {
		
	}

	input[name="query"] {
    	transition: width 0.3s ease;
	}

.log tbody tr:nth-child(odd) {
    background-color: #f9f9f9; /* Light gray for odd rows */
}

.log tbody tr:nth-child(even) {
    background-color: #ffffff; /* White for even rows */
}

/* Optional: Add a hover effect for better interactivity */
.log tbody tr:hover {
    background-color: #eef; /* Light blue on hover */
}

.log tbody tr {
    cursor: pointer;
    transition: background-color 0.3s;
}

.log tbody tr:hover {
    background-color: #eef;
}