/* ------- This places the graphics */
 /* Add and position parent navigation bar */
#nav {position: relative;      /* This moves the nav bar to desired location */
	  top: 0px;
	  width: 790px;
	  margin: 0;   /* Needed to anchor graphic to left edge */
 	  padding: 0;  /* Needed to anchor graphic to left edge */
	  border: 0;   /* Needed to anchor graphic to left edge */
	  height: 70;
	  background: #81b3b6 url(../images/navbar.jpg) no-repeat left; /*contains hover states*/
}


 #title {
    position: relative; 
    top:80px;  
    left:80px; 
	width:441px;
	height:110px;
    margin: 0;   /* Needed to anchor graphic to left edge */
 	padding: 0;  /* Needed to anchor graphic to left edge */
	border: 0;   /* Needed to anchor graphic to left edge */
	background-image: url(../images/title.jpg);
	background-repeat: no-repeat;
}
#title-dog {
    position: absolute; 
    top:-31px;  
    left:500px; 
	width:310px;
	height:198px;
    margin: 0;   /* Needed to anchor graphic to left edge */
 	padding: 0;  /* Needed to anchor graphic to left edge */
	border: 0;   /* Needed to anchor graphic to left edge */
	background-image: url(../images/title-dog.gif);
	background-repeat: no-repeat;
}
 #divNav { background: transparent;
		   margin: 0;
		   padding: 0;
		   height: 0px;
		   width: 0px;
}
#note {
    position: relative; 
    top:44px;  
    left:543px; 
	width:247px;
	height:182px;
	border:1px solid #000000; 
    margin: 0;   /* Needed to anchor graphic to left edge */
 	padding: 0;  /* Needed to anchor graphic to left edge */
	border: 0;   /* Needed to anchor graphic to left edge */
	background-image: url(../images/note.gif);
	background-repeat: no-repeat;
}
* html #nav {top: 0px;
}

* html .nav li {display:inline;        /* for IE only */
}

#nav li ul { margin: 0;      /* Space between parent and child */
	         padding: 0;     /* Adds to bottom hight of child */
}

#nav a { text-decoration: none;
}

/*float the parent bar items and space the display blocks */
#nav li { margin: 0;
	      width: auto;
	      float: left;
	      display: block;
}

#nav li ul { display: none;
}

/* Hover bar */
#nav li ul { position: relative;
	         top: 70px;           /* Drop child down the hieght of parent so child dosen't cover parent */
	         left: 0;             /* Align left end of child with parent */
	         padding-top: 0px;    /* Space above selections */
	         background: #ffffff; /* set same as web page color. */
	         height: 30px;        /* Background for child selections.  THIS IS A TRICK: by making this 
	                                 extra heigh and the background color the same as the web page, 
	                                 the selections will not disapear when the sursor strays low. */
	        right: 0;
	        padding-left:  0px;   /* move child bar selections to the right. Incompatable with FF.  Will add this to lenghth
	                                 of child bar, IE will not.  The fix is to add spaces to html unordered list. */
}

/*do the image replacement*/
#nav li span { position: absolute;
	           left: -9384px;
}

/* List each link in menu bar */
   #liHome a, 
   #liAbout a, 
   #liDamsAndSires a, 
   #liUpComing a, 
   #liContactUs a, 
   #liLinks a { display: block;
		        align: left;
		        height:70px;     /* Display height of graphic parent bar */
		        background : url(../images/navbar.jpg) no-repeat left;    /*contains hover graphic bar*/
}

/* Visible Nav Bar -- Set width and starting position of parent bar links.  This is a funny math. 
   Widths are actual, but starting points require some guess work. 
   To move starting point left, add to start number -- to move right subtract from start number.
   Match background position to Hidden Nav Bar background position.*/
#liHome a { width: 108px;
	        background-position: 0px 0px;
}

#liAbout a { width: 111px;
	         background-position: -108px 0px;
}

#liDamsAndSires a { width: 164px;
	                background-position: -219px 0px;
}

#liUpComing a { width: 189px;
	            background-position: -383px 0px;
}

#liContactUs a { width: 109px;
	             background-position: -572px 0px;
}

#liLinks a { width: 109px; 
	         background-position: -681px 0px;
}

/* HIdden Nav Bar --Set width and starting position of mouse over links 
   Also reach down negitive number of pixals to position hover link over parent link  */

#liHome a:hover, #liHome:hover a, #liHome.over a{
	background-position: 0px -89px; 
}

#liAbout a:hover, #liAbout:hover a, #liAbout.over a{
	background-position: -108px -89px;
}

#liDamsAndSires a:hover, #liDamsAndSires:hover a, #liDamsAndSiresh.over a{
	background-position: -219px -89px; 
}

#liUpComing a:hover, #liUpComing:hover a, #liUpComing.over a{
	background-position: -383px -89px;
}

 #liContactUs a:hover, #liContactUs:hover a, #liContactUs.over a{
	background-position: -572px -89px;
}

 #liLinks a:hover, #liLinks:hover a, #liLinks.over a{
	background-position: -681px -89px;
}

/* ---------------------- Second Navigation Bar ------------------------------------- */
 
 /* Add and position parent navigation bar */
#nav2 {position: relative;      /* This moves the nav bar to desired location */
	  top: 100px;
	  width: 790px;
	  margin: 0;   /* Needed to anchor graphic to left edge */
 	  padding: 0;  /* Needed to anchor graphic to left edge */
	  border: 0;   /* Needed to anchor graphic to left edge */
	  height: 47px;  /* Height of parent nav bar */
	  background: #81b3b6 url(../images/navbar2.jpg) no-repeat left; /*contains hover states*/
}
 
 
 #divNav2 { background: transparent;
		   margin: 0;
		   padding: 0;
		   height: 0px;
		   width: 0px;
}

* html #nav2 {top: 0px;
}

* html .nav2 li {display:inline;        /* for IE only */
}

#nav2 li ul { margin: 0;      /* Space between parent and child */
	         padding: 0;     /* Adds to bottom hight of child */
}

#nav2 a { text-decoration: none;
}

/*float the parent bar items and space the display blocks */
#nav2 li { margin: 0;
	      width: auto;
	      float: left;
	      display: block;
}

#nav2 li ul { display: none;
}

/* Hover bar */
#nav2 li ul { position: relative;
	         top: 80px;           /* Drop child down the hieght of parent so child dosen't cover parent */
	         left: 0;             /* Align left end of child with parent */
	         padding-top: 0px;    /* Space above selections */
	         background: #ffffff; /* set same as web page color. */
	         height: 30px;        /* Background for child selections.  THIS IS A TRICK: by making this 
	                                 extra heigh and the background color the same as the web page, 
	                                 the selections will not disapear when the cursor strays low. */
	        right: 0;
	        padding-left:  0px;   /* move child bar selections to the right. Incompatable with FF.  Will add this to lenghth
	                                 of child bar, IE will not.  The fix is to add spaces to html unordered list. */
}

/*do the image replacement*/
#nav2 li span { position: absolute;
	           left: -9384px;
}

/* List each link in menu bar */
   #liApplication a, 
   #liContract a,
   #liPuppies a,
   #liEndSpace a { display: block;
		           align: left;
		           height:47px;     /* Display height of graphic parent bar */
		           background : url(../images/navbar2.jpg) no-repeat left;    /*contains hover graphic bar*/
}

/* Visible Nav Bar -- Set width and starting position of parent bar links.  This is a funny math. 
   Widths are actual, but starting points require some guess work. 
   To move starting point left, add to start number -- to move right subtract from start number.
   Match background position to Hidden Nav Bar background position.*/
   
#liApplication a { width: 145px;
	        background-position: 0px 0px;
}

#liContract a { width: 240px;
	         background-position: -145px 0px;
}

#liPuppies a { width: 170px;
	         background-position: -385px 0px;
}

#liEndSpace a { width: 235px;
	         background-position: -555px 0px;
}

/* HIdden Nav Bar --Set width and starting position of mouse over links 
   Also reach down negitive number of pixals to position hover link over parent link  */

#liApplication a:hover, #liApplication:hover a, #liApplication.over a{
	background-position: 0px -48px; 
}

#liContract a:hover, #liContract:hover a, #liContract.over a{
	background-position: -145px -48px;
}

#liPuppies a:hover, #liPuppies:hover a, #liPuppies.over a{
	background-position: -385px -48px;
}

#liEndSpace a:hover, #liEnd:hover a, #liEnd.over a{
	background-position: -555px -48px;
}