/*iFix Mac Computers main menu by mm,www.ifixmaccomputers.com*/
/* Basic Reset */
ul{margin:0; padding:0;}
ol{margin:0; padding:0;}
pre{margin:0; padding:0;}
fieldset{margin:0; padding:0;}
#wrapper {
margin-left: auto;
margin-right: auto;
text-align: left; }
/* Content */
#japcontent {
	}
/* JAP Navigation Menu */
#japNav { margin:15px 0; list-style:none;
    /* Lucinda Grande is the font used on the website so keep the same on main menu just add some letter spacing. */
    font-family: "Lucida Sans Unicode","Lucida Grande",Verdana, Arial,Helvetica,sans-serif;letter-spacing:-0.5px; font-size:13px;
    /* Apply a subtle text-shadow to the text */
    text-shadow: 0 -1px 3px #202020;
    /* We want to add the shadow to the complete navigation menu. In order to do that, we'll need to set
    the correct width and height, and also the correct borders, in order to create the perfect drop shadow */
    width:980px; height:34px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;
    -moz-box-shadow: 0px 3px 3px #666666;
    -webkit-box-shadow: 0px 3px 3px #666666;
    box-shadow: 0 3px 4px #666666;
}
/*display:block; float:left; border-right:1px solid #5d5d5d; border-left:1px solid #929292; width:105px; height:34px; border-bottom:1px solid #575757; border-top:1px solid #797979;display:block; float:left; border-right:1px solid #0e5683; border-left:1px solid #8bb3cd; width:105px; height:34px; border-bottom:1px solid #0e5683; border-top:1px solid #8bb3cd;*/
#japNav li { display:block; float:left; border-right:1px solid #0e5683; border-left:1px solid #8bb3cd; width:105px; height:34px; border-bottom:1px solid #0e5683; border-top:1px solid #8bb3cd;
    /* Gradient backgrounds for the buttons. Generated using http://gradients.glrzad.com/ */
	background: rgb(125,185,232); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(125,185,232,1) 0%, rgba(41,137,216,1) 50%, rgba(32,124,202,1) 51%, rgba(30,87,153,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,185,232,1)), color-stop(50%,rgba(41,137,216,1)), color-stop(51%,rgba(32,124,202,1)), color-stop(100%,rgba(30,87,153,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(125,185,232,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(30,87,153,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(125,185,232,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(30,87,153,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(125,185,232,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(30,87,153,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(125,185,232,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(30,87,153,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
}
/* Set the states when hovering, except for the last item in the list (the search bar), since it doesn't need to change */
#japNav li:not(:last-child):hover {
	background: rgb(0,35,79); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(0,35,79,1) 0%, rgba(30,87,153,1) 100%, rgba(30,87,153,1) 100%, rgba(0,35,79,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,35,79,1)), color-stop(100%,rgba(30,87,153,1)), color-stop(100%,rgba(30,87,153,1)), color-stop(100%,rgba(0,35,79,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,35,79,1) 0%,rgba(30,87,153,1) 100%,rgba(30,87,153,1) 100%,rgba(0,35,79,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,35,79,1) 0%,rgba(30,87,153,1) 100%,rgba(30,87,153,1) 100%,rgba(0,35,79,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,35,79,1) 0%,rgba(30,87,153,1) 100%,rgba(30,87,153,1) 100%,rgba(0,35,79,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,35,79,1) 0%,rgba(30,87,153,1) 100%,rgba(30,87,153,1) 100%,rgba(0,35,79,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00234f', endColorstr='#00234f',GradientType=0 ); /* IE6-9 */
}
/* When the user clicks the button, we simply change the box inset (compared to the "hover") */
#japNav li:not(:last-child):active {
	background: rgb(14,86,131); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(14,86,131,1) 0%, rgba(14,86,131,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(14,86,131,1)), color-stop(100%,rgba(14,86,131,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(14,86,131,1) 0%,rgba(14,86,131,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(14,86,131,1) 0%,rgba(14,86,131,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(14,86,131,1) 0%,rgba(14,86,131,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(14,86,131,1) 0%,rgba(14,86,131,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e5683', endColorstr='#0e5683',GradientType=0 ); /* IE6-9 */
	/* When the user clicks the button, we simply change the box inset */
    -moz-box-shadow: inset 0 1px 2px 4px #03629e;
    -webkit-box-shadow: inset 0 1px 2px 4px #03629e;
    box-shadow: inset 0 1px 2px 4px #03629e;
}
#japNav li a { color:white; text-decoration:none; text-align:center; display:block; line-height:34px; outline:none; }
/* Rounded corner for the first in last item. Shorthand: Top left, Top right, Bottom right, Bottom left.
We also remove the borders, since they don't need them. */
#japNav li:first-child {
    -moz-border-radius:4px 0 0 4px;
    -webkit-border-radius:4px 0 0 4px;
    border-radius:4px 0 0 4px;    
    border-left:none;
}
/* The first child image - the logo - has to be centered. Because of the image dimensions, we manually need to shift it a bit. */
#japNav li:first-child a img {
   vertical-align:middle; margin-top:-2px;
}
#japNav li:last-child {
    -moz-border-radius:0 4px 4px 0;
    -webkit-border-radius:0 4px 4px 0;
    border-radius:0 4px 4px 0; 
    border-right:none;  
    /* The width of the last menu item (search bar) is bigger than the others */
    width:124px;
}
/*Fade in animation (Webkit only)
@-webkit-keyframes showMenu {
    from { opacity: 0; top:-10px; }
    to   { opacity: 1; }
}
#japNav {
     -webkit-animation: showMenu 1s; position:relative;
} */