﻿/* Source: http://line25.com/tutorials/how-to-create-a-pure-css-dropdown-menu */

/*******************************************************/
/* font-size:16px - not supported in Internet Explorer */
/* font-size:2.5em - supported in all browsers         */
/*******************************************************/ 
nav ul ul 
{
 display: none;
 z-index: 99999; /* ensures the menu appears above star ratings */
}

nav ul li:hover > ul 
{
 display: block;
}

nav ul {
 /* The below commented codes create a nice oval shaded menu - just not using that style now */
 /* background: #efefef; */ /* light grey, almost blue color */
 /*
 background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);  
 background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
 background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
 box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
 padding: 0 20px;
 border-radius: 10px; 
 */
 
 /* background: white; */ /* I replaced white with INHERIT below, so as to get the color of the main page */
 background: inherit;

/*
 background: linear-gradient(top, inherit 0%, #bbbbbb 100%);  
*/
/* background: -moz-linear-gradient(top, inherit 0%, #bbbbbb 100%); */ /* Code for Firefox */
/*
 background: -webkit-linear-gradient(top, inherit 0%,#bbbbbb 100%); 
*/
 /* box-shadow: 0px 0px 9px rgba(0,0,0,0.15); */
 /* padding: 0 20px; */
 /* border-radius: 10px;  */
 list-style: none;
 position: relative;
 display: inline-table;
 font-family: Calibri, Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
 padding: 0px 0px;
 margin:0px 0px;
}

nav ul:after {
             content: "";
             clear: both;
             display: block;
}

nav ul li {
	float: left;
}

nav ul li:hover
{
/* background: #FFCC00; */ /* yellow */
background: #0fa1e0; /* Light blue */
/*
 background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
 background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
 background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
*/
}

nav ul li:hover a 
{
 /* color: #fff; */ /* Whitish color */
 color: white;
}
	
nav ul li a 
{
 display: block;
 /* padding: 15px 40px; */
 padding: 10px 20px;
 color: #3333FF;  /* blue */
 text-decoration: none; /* The text-decoration property is mostly used to remove underlines from links for design purposes */
}

nav ul ul {
    /* background: #FFCC00; */ /* yellow */
    background: #0fa1e0; /* Light blue */
    border-radius: 0px;
    padding: 0;
    position: absolute;
    top: 100%;
    width:160px; /* Added by me */ 
}

nav ul ul li {
		float: none; 
		border-top: 1px solid #6b727c;
		border-bottom: 1px solid #575f6a;
		position: relative;
}
nav ul ul li a 
{
 /* padding: 15px 40px; */
 padding: 10px 20px;
 /* color: #fff; */ /* Whitish color */
 color: white; /* Not sure if this color is needed again */
}	

nav ul ul li a:hover 
{
 /* background:#996600; */ /* brownish color */
 background: #0873a1; /* Dark blue */
}

nav ul ul ul {
   position: absolute;
   left: 100%; 
   top:0;
}
nav ul ul ul li {
		float: none; 
		border-top: 1px solid #6b727c;
		border-bottom: 1px solid #575f6a;
		position: relative;
}
nav ul ul ul li a 
{
 /* padding: 15px 40px; */
 padding: 10px 20px;
 /* color: #fff; */ /* Whitish color */
 color: white; /* Not sure if this color is needed again */
}	
nav ul ul ul li a:hover 
{
 /* background:#996600; */ /* brownish color */
 background: #0873a1; /* Dark blue */
}

ul.TextClass02 {
 font-weight:bold;
 font-size: 0.8em;
 text-align: center;
}

ul.TextClass01 {
 font-weight:bold;
 font-size:1.4em;
 text-align: center;
}

li.TextClass01 {
 font-weight:bold;
 font-size: 0.5em;	
 text-align: center;
}