body {
   margin: 0;
  padding: 0;
  font: 100% font-family: system-ui, Arial, sans-serif;
  line-height: 1.6;
  color: #000;  
  background: #f4f6f8;
}


table  { width: 100%; font-size: 1.2em; padding: 2px; }

#table1 {
  max-width: 1100px;
  width: 95%;
  margin: 20px auto;
  background: #fff;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.08);
}
#menu1    { background: white; width: 100%; }
#text1, #text2 {
  width: 100%;
  margin: 0;
  background: none;
}

#menu2    { background: white; width: 100%; text-align:left; }

img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 20px auto;
  border-radius: 4px;
}


.block-intro {
  background: #e8f0f5;
  padding: 20px;
  border-radius: 6px;
  text-align:center;
}

.block-feature {
  background: #f4f1e8;
  border-left: 5px solid #e0cf89;
  padding: 20px;
  margin: 25px 0;
  text-align:center;
}


/* 4th April 2026 */

/* Improve readability */
p {
  margin: 0 0 14px 0;
}

/* Make headings cleaner */
h1, h2 {
  margin-top: 24px;
  text-align: center;
}
h3    { color: black; font-size: medium; font-family: arial; font-weight: bold; margin: 1em 0; }
h4      { color: #000; font-size: medium; font-family: arial; font-weight: normal; margin: 1.3em; }
h5    { color: black; font-size: 1em; font-family: arial; font-weight: bold; margin: 1.67em 0; }
h6   { color: #000; font-size: 1em; font-family: arial; font-weight: bold; margin: 2.33em 0; }


.p6, .p7, .p1, .p2, .p3 {
  background: #f5f5f5;
  padding: 10px;
  margin: 20px 0 10px 0;
  border-radius: 6px;
  text-align:center;
}

.p-centre { text-align:center; }
.p-left { text-align:left; }

.box {
  padding: 10px;
  margin: 20px 0;
  border-radius: 6px;
}

.box-blue { background: #B6D1EF; }
.box-green { background: #BCE9BD; }
.box-yellow { background: #FCF9BA; }
.box-orange { background: #FFC68C; }
.box-highlight { background: #6DBAF3; font-weight: bold; }


a {
  color: #8a6d1d;
}

a:hover {
  color: #caa85a;
}

pc        {
	text-align: center;
	margin: 5px;
	color: #000;
	font-size: medium;
	font-family: arial;
	font-style: normal;
	font-weight: normal;
	font-stretch: normal;
}

pl        {
	text-align: left;
	margin: 5px;	
	color: #000;
	font-size: medium;
	font-family: arial;
	font-style: normal;
	font-weight: normal;
	font-stretch: normal;
}


.p4 {
	margin: 5px;
	padding:3px;
	font-size: 1em;
	font-weight:bold;
	padding-bottom: 5px;
	background: #DBFBFB;
}
.p5 {
	margin: 5px;
	padding:3px;
	font-size: 1em;
	padding-bottom: 5px;
	background: #DBFBFB;
}

.p8 {
	margin: 5px;
	padding:3px;
	font-size:1.6em;
	padding-bottom: 5px;
	background: #BCE9BD;	
}
	
.p9 {
	margin: 5px;
	padding:3px;
	font-size:1.6em;
	padding-bottom: 5px;
	background: #FCF9BA;	
}


.h2h    {
	color: #000;
	margin: 0.5em 0;
	font: bold normal x-large arial;
	background: #80FFFF;
	border-width: thin;
	border-style: solid;
	padding: 5px;
	}
	
.h3h    {
	color: #000;
	margin: 0.5em 0;
	font: bold normal x-large arial;
	background: #80FFFF;	
	padding: 5px;
	}

#column1 { width:300px; margin: 10px;}
#column2 { width:300px; margin: 10px;}


div {font-family: arial; }

#d1 {
background:#EBE496; 
padding: 5px;
}

#head1  {
	margin-bottom: 5px;
	height: 120px;
	background: #fff;
	width: 100%;
}
#left1   { margin: 2px; width: 170px; height: auto;  background-color:#F1F3CB }
#left450   { margin: 2px; width: 166px; height: 800px;  background-color:#F1F3CB }
#left450h   { margin: 2px; width: 166px; height: 1600px;  background-color:#F1F3CB }

#body1 {text-align: left; width:100%; }

#foot1 {clear:both; margin-top: 30px; bottom: 0; left: 0; width: 100%; background: aqua; text-align: center;}

	
#menu a, #menu a:visited {
  text-align:left;
  font-size: small;
  color:#000000; 
  display:block;  
  height:2.5em;   
  }
#menu a:hover {
  color:#000000;
  background-color:#ffff99;  
  }
  
#menuhigh a, #menuhigh a:visited {
  text-align:left;
  font-size: small;
  color:#000000; 
  display:block;  
  height:3.6em;   
  }
#menuhigh a:hover {
  color:#000000;
  background-color:#ffff99; 
 
  }
  
 
 
div.menuMain  { width: 98%; height: 60px; padding-top: 25px; background-color:#ffc; font-size: 1em; }
  div.menuMain a, div.menuMain a:visited   {
	color: #000;
	text-decoration: none;
	padding: 20px;
	margin: 1px;
	height: 80px;
	background: #E0CF89;
	float: none;	
}
div.menuMain a:hover  { color: #000000; background-color: #ffc;  }
div.menuMain a:focus  { color: #000000; background-color: #ffa;  }

  
  #menuh  { padding: 8px; width: 95%; height: 60px; background-color:#ffc; }
  #menuh a, #menuh a:visited   {
	color: #000;
	font-size: 16px;
	text-decoration: none;
	margin-right: 2px;
	height: 50px;
	background: #E0CF89;
	padding: 10px;
	float: none;
}
#menuh a:hover  { color: #000000; background-color: #ffc;  }
#menuh a:focus  { color: #000000; background-color: #ffa;  }

 #menup  { padding: 8px; width: 750px; height: 60px; background-color:#ffc; }
  #menup a, #menup a:visited   {
	color: #000;
	font-size: 14px;
	text-decoration: none;
	margin-right: 2px;
	height: 35px;
	background: #E0CF89;
	padding: 3px;
	float: none;
}
#menup a:hover  { color: #000000; background-color: #ffc; }
#menup a:focus  { color: #000000; background-color: #ffa; }

/* New Blog Section */
.blog-section {
  background: #ADD8E6;
  padding: 15px;
  margin: 25px 0;
  text-align:center;  
}

.blog-list {
  margin: 10px 0 15px 20px;
}

.blog-list li {
  margin-bottom: 6px;
}


/* responsive menu */

.horizontal-nav {
  background: #006666; 
    }
.horizontal-nav ul {
  background: #006666;
  float: left;
  text-align: center;
  list-style-type:none;
}
.horizontal-nav ul li {
  float: left;
  border-left: 1px solid #006666;
  }
.horizontal-nav ul li:first-child {
  border-left: 0 none;  
}
.horizontal-nav ul li a {
  display: block;
  padding: 10px 20px;
  color: #fff;
  border-top: 1px solid #006666;
  border-left: 1px solid #006666;
  text-decoration:none;
  }
.horizontal-nav ul li:first-child a {
  border-left: 0 none;
  text-decoration:none;
}
.horizontal-nav ul li a:hover {
  background: #000;
  text-decoration:none;
}

.menuspaced {
    background-color: #ffc68c;
    border: none;
    padding: 1px 5px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    margin: 2px 5px;
    cursor: pointer;
}





/* DROPDOWN Navbar container */
.navbar {  
  display: flex;
  flex-wrap: wrap;
  background-color: #fc6;
  font-family: Arial;
  overflow: visible; /* important */
  text-align:center;
}

.navbar a,
.dropdown {
  position: relative; /* helps stacking */
  display:inline-block;
}


/* Links inside the navbar */
.navbar a {
  font-size: 16px;
  color: black;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

/* The dropdown container */
.dropdown {
  float: left;
  position: relative;
  
}

/* Dropdown button */
.dropdown .dropbtn {
  font-size: 16px; 
  border: none;
  outline: none;
  color: black;
  padding: 14px 16px;
  background-color: inherit;
}

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #f28500;
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background: #fc6;
  min-width: 160px;
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #ddd;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}