
/* Main Navigation */


/* End Main Navigation */

/* Navigation */
#mainnavigation_control_reveal	{
	display : none;
}

.dropdown ul {
  display  : none;
  position : absolute;
  top      : 100%;
  left     : 0;
  z-index : 2147483647;
}

[dir=rtl] .dropdown ul{
  left  : auto;
  right : 0;
}

.dropdown ul ul,
[dir=rtl] .dropdown ul .dropdownLeftToRight ul{
  top   : 0;
  left  : 100%;
  right : auto;
}

[dir=rtl] .dropdown ul ul,
.dropdown ul .dropdownRightToLeft ul{
  left  : auto;
  right : 100%;
}

.dropdown li{
  position        : relative;
  display         : block;
  list-style-type : none;
}

.dropdown > li{
  display : inline-block;
}

/*  Make titles wrap

 white-space     : pre;
 */
.dropdown a,
.dropdown span{
  display         : block;
  text-decoration : none;
}

.dropdown li:hover > ul{
  display : block;
}

.dropdownVertical{
  display : inline-block;
}

.dropdownVertical > li{
  display : block;
}

.dropdownVertical ul{
  top  : 0;
  left : 100%;
}

[dir=rtl] .dropdownVertical ul{
  left  : auto;
  right : 100%;
}

.dropdownJavaScript li:hover > ul{
    display : none;
}

.dropdownJavaScript li.dropdownOpen > ul{
  display : block;
}


/* Normal */

.mainnavigation {
    background-color : #283891;
    color : white;
    height : 30px;
    font-size : .95em;
    position : relative;
 }


/* Without absolute, nav wont float over */ 

.mainnavigation ul	{
    z-index : 20;
    position : absolute;
    padding-left : 0px;
    margin : 0;
}

.mainnavigation	ul li 	{	
    position : relative;
    text-transform : uppercase;
    float : left;
    line-height : 30px;
    vertical-align: middle;
}

.mainnavigation ul li	a			{	
    padding : 0 26px 0 4px;
    height : 100%;
    color : white;
    font-weight: bold;
}

.mainnavigation	ul li.hilight a {	
    color : white;
}

.mainnavigation     ul li	a:hover, 
.mainnavigation     ul li.hilight a:hover		{	
    color : #97d8f6;
}

/* ---------------------- */

/*	These next two - the width must be < 2*twocol / 3*threecol width
*/

.mainnavigation	ul ul 				{
	position : absolute;
	width : 280px;
	top : 30px;
	display: none;
    background-color : #6772da;
    padding-left :0;
}

.mainnavigation	ul ul li			{	
	text-transform : uppercase;
	line-height: 22px;
	position:relative;
	width : 280px;
	display: block;
	height : 100%;
	letter-spacing: normal;
}

.mainnavigation	ul ul.twocol {
	width : 600px !important;
}

.mainnavigation	ul ul.threecol {
	width : 900px;
}

.mainnavigation ul ul li	a			{	
	padding : 5px 10px 5px 10px;
  	color : white !important;
	display: block;
	height : 100%;
}



.mainnavigation ul ul li.sspage	a  {
	padding-left : 30px;
}

.mainnavigation ul ul li	a:hover		{	
	background-color : #72a0fa !important;
}

.mainnavigation	ul li.hilight ul a {
    color : #2aaefe;
}

.mainnavigation	ul li ul li.last			{	
	border-bottom : none;
}

.mainnavigation	ul li.hilight ul li a:hover {		
}

#topsubmenu {
    display : none;
}




@media only screen and (min-width : 1000px) and (max-width : 1200px)
{

.mainnavigation ul li	a			{	
    padding : 0 8px 0 0px;
}

#main-nav .lhs img    {
    margin-left : 0px;
}

.mainnavigation ul	{
    padding-left : 0px;
    font-size : .95em;
}

}




/*







@media only screen and (min-width : 700px) and (max-width : 1000px)
{
    
#show_is_narrow_and_mobile {
    background-color : #FFD324;
}
 #main-nav .lhs    img {
    width : 600px;
    margin:auto auto auto 50px;
 }
 
 #main-nav .lhs    img.logo {
     height : 70%;
     width : auto;
     right : 0;
 }


 }
 @media only screen and (min-width : 500px) and (max-width : 700px)
{
#show_is_narrow_and_mobile {
    background-color : #fbe3e4;
}
 #main-nav .lhs    img {
     width : 400px;
    margin:auto auto auto 30px;     
}
 }
 @media only screen and (min-width : 200px) and (max-width : 500px)
{
#show_is_narrow_and_mobile {
    background-color : #00ffff;
}
 #main-nav .lhs    img {
     width : 300px;
    margin:auto auto auto 10px;     
}
 }
*/

@media only screen and (min-width : 200px) and (max-width : 1000px)
{
    

#main-nav       {  
    position : relative;
     height : 125px;
     line-height : 125px;
}        

 #main-nav .lhs    {
     float : none;
     width : 100%;
 }

 #main-nav .lhs    img {
    position : absolute;
    top:0;
    bottom:0;
}
 
#main-nav .lhs    img.logo {
     display : none;
 }

 #main-nav .rhs    {
     text-align: right;
     float : none;
     width : 100%;
     height : 100px;
 }

 /* STD */
 
 #mainnavigation_control	{
    display: none;
    top : 136px;
}

#mainnavigation_control_reveal	{
    position : absolute;
    width : 100%;
    /*
    height : 24px;
    background-color : white;
 background: white url(/resources/images/small-top-logo.png) no-repeat 0 60%;
    display : block; 
    background-size : 80% auto;	*/
    display : block;
}

div.ticon   {
    width : 36px;
    height : 36px;
    cursor : pointer;
    opacity : 1;
    display  :block;
    float : left;
}

div.ticon.right   {
    float : right;
}

div.ticon:hover   {
    opacity : .8;
}

#translate_box,
#search_box  {
    display : none;
}


canvas  {
}

/* I can't get the color working - needs to be set in javascript */

#nr_canvas  {
	background-color : white;
	color : #2A2672 !important;
	cursor : pointer;
	position : absolute;
	top : 8px;
	right : 5px;
}


#search_canvas  {
}

/* Main Menu */

.mainnavigation 	{
	overflow : hidden;
	position : absolute;
	background-color: black;
	/* top : 0px; */
	z-index : 99998;
	width : 100%;
	margin-left : 0;
	height : auto;
	display : block;
	border : none;
	padding : 0;
        margin-top : 0;
}

.mainnavigation ul	{
	position : relative;
        padding-left : 0;
}

.mainnavigation	ul li 	{
	line-height : 20px;
	height : auto;
	display : block;
	z-index : 333;
	float : none;
	text-align : left;
	border : none;
	border-left : none;
	margin : 0;
}

li.hassub
{
        background-image:  url(/resources/images/lib/menudownarrow-white.png);
        background-repeat : no-repeat;
        background-position: right center;
        background-size : 30px 30px;
}

.mainnavigation	ul li.hilight {
	border-left : none;
    background-color : #444 !important;
}

.mainnavigation ul li	a			{	
	padding : 13px 0 13px 10px;
	display : block;
	width : 100%;
	font-size : 1.2em;
	color : white !important;
}

.mainnavigation ul li	a:hover, 
.mainnavigation	ul li.hilight a:hover		{	
	color : white !important;
    background-color : #64a8cb !important;
}



/*	opacity : 0;
	display: none;
*/

.mainnavigation	ul ul 				{
	margin-left : 0px;
	position : relative;
	width : 100%;
	left : 0px;
	top : 0px;
	text-align : left;
	z-index : 999999;
        color : white;
            background-color : black;
        
}

.mainnavigation	ul ul li			{	
	background-color : #444;
	border-bottom : none;
	line-height: inherit;
	width : inherit;
	height : 100%;
}

.mainnavigation	ul ul li.last			{	
	border-bottom : none;
}

.mainnavigation ul ul li	a			{
	padding : 13px 0 13px 10px;
	text-transform : uppercase;
	background-color : inherit;
	color : white !important;
        width : 100%;
        border-bottom :none;
}

.mainnavigation ul ul li	a:hover		{	
    background-color : #64a8cb !important;
}

.mainnavigation ul li ul li.hilight	  a {
        background-color : #444 !important;
}

/* ======================================================== */
#topsubmenu {
    display : block;
    float : right;
    height : 60px;
    width : 70%;
}

#topsubmenu li.hassub {
    background-image:  url(/resources/images/lib/menudownarrow.png);   
    background-size : 40px 40px;

}
#topsubmenu ul {
    width : 100%;
}

#topsubmenu li {
    width : 100%;
    font-weight: bold;
}

#topsubmenu ul li {
    text-align : right;
}

#topsubmenu ul li ul li  {
    text-indent : 1%;
    text-align : left;
    background-color : black;
}

#topsubmenu ul li ul li._xd  {
    text-indent : 2%;
}

#topsubmenu li  a {
    color : black;
}

#topsubmenu ul li ul li a{
    color : white;
}

#topsubmenu ul ul li {
    background-color : black;
    color : white;
    line-height : 38px;
    height : 38px;
}

#topsubmenu a:hover {
    color : orange;
}


 #msearch	{
 }


 }
 
