/* Webfont: Lato-Medium */@font-face {
    font-family: 'LatoMedium';
    src: url('../media/fonts/Lato-Medium.eot'); /* IE9 Compat Modes */
    src: url('../media/fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../media/fonts/Lato-Medium.woff') format('woff'), /* Modern Browsers */
         url('../media/fonts/Lato-Medium.ttf') format('truetype'); 
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}


/* from http://candpgeneration.com/toys/CSS3-dropdown-tut.php */
.navigation {
            /* width:600px;*/
            padding-bottom:15px;
            height:12px;
        }
        .navigation ul{
        /* positioning */
        	position:relative;
            z-index:1000;
        /* remove the dots next to list items: */
            list-style:none; 
        /* get rid of any default or inherited margins and padding: */
            margin:0; 
            padding:0; 
            
        /* styling: */
           /*font-family: 'Lato', sans-serif;*/
           font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
            font-weight: normal;
            font-size: 16px;

        }
        
        /* we're using the direct descendant selectors > to ONLY affect the main menu items */
        .navigation > ul > li {
        /* positioning */ 
            position: relative;
            float: left;
        /* styling: */
            margin-right: 1px;
            margin-top:2px;
            height:36px;
        }
        .navigation > ul > li > a {
        /* positioning */ 
            display:block;
        /* styling: */
            /*background-color: #34B249; /*  grey */
            padding:10px 8px;
            text-decoration:none;
            color:#333; 
            font-weight:bold;
            
        }
        .navigation > ul > li > a:hover{
        /* styling: */
            /*background-color:#1E588A; /* grey */
            color:#666; /* light grey */
        }
        
        .navigation ul ul{
            
            /*background-color:#e6056f; /* remove. this is for illustration purposes only */
            /*width:440px; /* you need a width to accommodate tertiary menus */
            
            position:absolute;
            z-index:100;
            font-size: 16px;
            height: 0;
            overflow: hidden;            
            -webkit-transition: height 0.3s ease-in;
            -moz-transition: height 0.3s ease-in;
            -o-transition: height 0.3s ease-in;
            -ms-transition: height 0.3s ease-in;
            transition: height 0.3s ease-in;
        }
        

        /* don't display tertiary box yet */
        .navigation > ul > li:hover ul ul, .navigation > ul > li > a:hover ul ul{
            height:0;
            
        }
        /* tertiary drop-down box */
        .navigation ul ul ul{
            left:220px;
            width:220px;
        }
        
        .navigation > ul > li:hover ul, .navigation > ul > li > a:hover ul,
        .navigation ul ul li:hover > ul, .navigation ul ul li a:hover > ul{
            height:220px; /* need a height to accommodate any tertiary menus */
        }
        
        /* drop-down item styles */
        /* if you want different styling for tertiary menus, just copy the 4 rules below and insert an additional ul: for example: ".navigation ul ul li", becomes: ".navigation ul ul ul li" */
        
        .navigation ul ul li{
            background-color:#FAF506; /* grey */            
           /* Convert to mega-menu columnated bu ul ul li */
            /*float:left;    */
        }
        
         .navigation ul ul table
         {
             /* for megamenu */
        }
         .navigation ul ul table tr td
         {
             /* for megamenu */
            background-color:#999; /* grey */
            white-space:nowrap;
            padding:0px;
           /* border:1px solid #1E588A;*/
            line-height:0.1em;
        }
        
        .navigation ul ul li:hover {
            /*background-color:#999; /* grey */
        }
        
        .navigation ul ul li a {
            display:block;
            text-decoration:none;
            margin:0 0px;
            padding:6px 12px;
            line-height:1.5em;
            color:#FAF506; /* grey */
        }
        .navigation ul ul li a:hover {
            /*background-color:#999;*/
            color:#000; /* white */
             -webkit-transition: background-color 0.3s ease;
            -moz-transition: background-color 0.3s ease;
            -o-transition: background-color 0.3s ease;
            -ms-transition: background-color 0.3s ease;
            transition: background-color 0.3s ease;
        }

.Tab_gotFocus
{
    border-left:1px solid #7395BF;
    border-top:1px solid #7395BF;
    border-right:1px solid #7395BF;
    border-bottom:1px solid #F7F7EB;
    border-top-left-radius: 5px;
    border-top-right-radius:5px;
    background-color:#F7F7EB;
    font-size:15px;  padding:6px 18px; 
    text-align:center;
    float:left;
}
.Tab_noFocus
{
    border-left:1px solid #7395BF;
    border-top:1px solid #7395BF;
    border-right:1px solid #7395BF;
    border-bottom:1px solid #7395BF;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color:#EFEFD5;
    font-size:15px;  padding:6px 18px; 
    text-align:center;
    float:left;
}
.Tab_noTab
{
	background-image:url(../media/tab_notab.jpg); 
	background-repeat:no-repeat;
    width:142px; 
    height:40px; 
    text-align:center;
}