﻿/* ####################   Navigation bar CSS styling   ################## */ 
.mynavbar {
	position: relative;
  width: 1050px;
  height: 40px; /* corresponds to 'line-height' of a.navbartitle below */
  margin: 0; border: 0; padding: 0;
  background-color: #000080; 
}


a.navbartitle {
  display: block; 
  float: left;
  color: white;
  background-color:  #000080;
  font-family: ChatrikUni, Arial, Raavi, AnmolUni, AnmolUniBani;
  font-size: 20px;
  font-weight: bold;
  margin: 0; border: 0; padding: 0;
  line-height: 40px; /* corresponds to 'top' value of .submenu below */
  text-align: center;
  text-decoration:none;
}
a.navbartitle:hover {
  background-color: #447755;
}
/* menu title widths */
#t1 { width: 200px; }
#t2 { width: 200px; }
#t3 { width: 200px; }
#t4 { width: 200px; }
#t5 { width: 250px; }

.submenu {
	position:absolute;
  z-index: 2;
  top: 40px; /* corresponds to line-height of a.navbartitle above */
  padding: 0; margin: 0; 
	width:200px; /* If adjust this, then adjust width of .submenu below a too */
	color: white;
	background-color:  #666633;
	border: 1px solid #447755; /* box around entire sub-menu */
  font-family: ChatrikUni, Arial, Raavi, AnmolUni, AnmolUniBani;
	font-size: 18px;
}
/* Fix IE formatting quirks. */
* html .submenu { width: 148px; } /* IE needs narrower than width of .submenu above */
/* End */

/* position of each sub menu */
/* We just eyeball the position of each submenu here -- can move left or right as needed. 
   If you adjust menu title text, you might want to adjust these too. */
#Gurbani_submenu {  left: 0px; visibility: hidden;  }
#Articles-1_submenu {  left: 200px; visibility: hidden;  }
#Articles-2_submenu {  left: 400px; visibility: hidden; }
#Articles-3_submenu {  left: 600px; visibility: hidden; }
#Articles-4_submenu { left: 800px; visibility: hidden; }

.submenu a
{
  display: block;
  color: #fff; 
  background-color: #ffde00;
  width: 190px; /* This should be width of .submenu above minus right-side padding on next line */
  padding: 5px 0px 4px 10px;
  text-align: left;
  text-decoration: none;
  background-color: #0402db; 
  border-bottom: #447755 dotted 2px; 
  border-top: 0; border-left: 0; border-right: 0;
}


ul { position: relative; display: block; }
li { position: relative; display: block; }

.submenubox { 
  margin: 0; padding: 0; border: 0;
}
.submenubox ul
{
  margin: 0; padding: 0; border: 0;
  list-style-type: none;
}

.submenubox ul li { 
  margin: 0; padding: 0; border: 0;
}

.submenubox ul li a:link { }
.submenubox ul li a:visited { }
.submenubox ul li a:hover
{
  color: #c6e8e2; /* text color for submenu items */
  background-color: #447755;
  border-bottom: #447755 dotted 1px; 
}


