.content-box-morse {
	padding: 10px;
    background: platinum;
    border-radius: 10px;
	box-shadow: var(--shadow);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
	font-size: 20px;
}

.English-Text {
	direction: ltr; 
	font-size:20px; 
	width:100%; 
	padding: 8px 12px; 
	background-color: black; 
	color: white;
}

.Label1 {
	background-color: black; 
	color: white; 
	border-radius: 4px 4px 4px 4px;
	font-weight: bold;
}

.Label2 {
	background-color: black; 
	color: white; 
	border-radius: 4px 4px 4px 4px;
	font-weight: bold; 
	display: none;
}

.Morse-Code {
	direction: ltr; 
	font-size:20px; 
	width:100%; 
	background-color: black; 
	color: white; 
	display: none;
}

.Button1 {
	background: #DC143C;
	color: white;
	font-family: vazir;
	font-size: 16px;
	box-shadow: 2px 5px #888888;
	border-radius: 4px 4px 4px 4px;
	padding: 4px 20px 4px 20px;
}

.Button2 {
	background: #DC143C;
	color: white;
	font-family: vazir;
	font-size: 16px;
	box-shadow: 2px 5px #888888;
	border-radius: 4px 4px 4px 4px;
	padding: 4px 20px 4px 20px;
	display: none;
}

.Button1:hover {
	background: rgb(212, 255, 158);
	color: black;
}

.Button2:hover {
	background: rgb(212, 255, 158);
	color: black;
}

.spacer {
  display: none;
}

table {
	text-align: center; 
	direction: ltr; 
	font-family: Arial; 
	font-weight: bold;
	width: 100%;
	border-collapse: collapse;
	background-color: #000000; 
	color: #f0f0f0;  /* Dark gray text */
}

th, td {
  border: 1px solid #444444; /* Subtle border */
  padding: 6px 8px;
  text-align: center;
}

th {
  background-color: #1a1a1a; /* Slightly lighter black for header */
  color: #ffcc00; /* Gold/yellow for emphasis */
  font-weight: bold;
}

tr:nth-child(even) {
  background-color: #111111; /* Alternating row color */
}

tr:hover {
  background-color: #222222; /* Hover effect */