﻿/* WebShell Styles for Menu v4.24+55.01 DCQ - GDH 03-Nov-18 */

/* Add the following to the head section of each page (below the defaultstyles.css reference): */
/* <link rel="stylesheet" type="text/css" href="css/menustyles.css"> */

/* Styles in this file are overridden by specific styles applied in-line and directly in a page */

/* ====== EXTERNAL FONTS USED ====== */
/* See content.css for usage and font families
   <link href='http://fonts.googleapis.com/css?family=Happy+Monkey' rel='stylesheet' type='text/css'>
   should be placed in HTML page, after default.css */

/* ====== BASIC SETTINGS ====== */

/* Page Background */
body
{
background-color:transparent; /* See-Through */
/* background-color:#C0C0C0; /* Solid */
overflow:hidden; /* IE standards mode iframe scrolling fix */
}

p
/* Content Text */
{
color:#3C3C3C;
font-family: Verdana, Geneva, Tahoma, sans-serif;
font-size:100%;
font-weight:normal;
}

ul
/* Main Menu */
{
margin: 0;
padding: 0;
list-style: none;
font-family: Roboto, "Open Sans", Tahoma, Geneva, Verdana, sans-serif;
font-size: 100%;
/* text-shadow: 0.0em 0.0em 0.1em #444444; /* CSS3 Offset-Rt, Offset-Dn, Offset-Blur, Colour */
}

li
/* Menu Items */
{
line-height:36px /* Same as menuLineHt in menuifr.htm */
}

hr
/* Horizontal Lines */
{
color:#EEEEEE; /* IE */
background-color:#EEEEEE; /* FF, CR, etc */
}

/* Link Settings */
a
{
display:inline-block; height:auto; /* Only setting that works with IE, FF and CR  */
padding:0px 15px; /* Top & Bot / Left & Right */
}
a:link {color:#F8F8F8; text-decoration:none;}      /* unvisited link */
a:link.ndmenu {color:#F8F8F8; text-decoration:none;}      /* unvisited link */
a:link.return {color:#FFFFA4; text-decoration:none;}      /* return item unvisited link */
a:visited {color:#F8F8F8; text-decoration:none;}  /* visited link */
a:visited.ndmenu {color:#F8F8F8; text-decoration:none;}  /* visited link */
a:visited.return {color:#FFFFA4; text-decoration:none;}  /* visited link */
/* mouse over link - a:hover MUST come after a:link and a:visited */
a:hover {color:#FEFEFE; text-decoration:none; background-image:url('../Images-UI/transpBlack50.png');} 
a:hover.ndmenu {color:#FEFEFE; text-decoration:none; background-image:url('../Images-UI/transpBlack50.png');} 
a:active {color:#FEFEFE; text-decoration:none;}  /* selected link - a:active MUST come after a:hover */

/* ====== SUB MENU SETTINGS ====== */

ul.submenu
/* Sub Menu */
{
margin: 0;
padding: 0;
list-style:none;
font-family: Roboto, "Open Sans", Tahoma, Geneva, Verdana, sans-serif;
font-size: 90%;
color:#3C3C3C; /* Non-link text, e.g. Sub Menu name */
}

li.submenu
/* Sub Menu Items */
{
float: left;
line-height:24px /* Same as smenuLineHt in menuifr.htm */
}

/* Sub Menu Link Settings */
a.submenu
{
display:inline-block; height:auto; /* Only setting that works with IE, FF and CR  */
padding:0px 15px; /* Top & Bot / Left & Right */
}
a.submenu:link {color:#3C3C3C; text-decoration:none;}      /* unvisited link */
a.submenureturn:link {color:#3C3C3C; text-decoration:none;}      /* return item unvisited link */
a.submenu:visited {color:#3C3C3C; text-decoration:none;}  /* visited link */
a.submenureturn:visited {color:#FFFFA4; text-decoration:none;}  /* visited link */
/* mouse over link - a:hover MUST come after a:link and a:visited */
a.submenu:hover {color:#EEEEEE; text-decoration:none; background-image:url('../Images-UI/transpBlue90.png');} 
a.submenureturn:hover {color:#FFFFA4; text-decoration:none; background-image:url('../Images-UI/transpBlue90.png');} 
a.submenu:active {color:#EEEEEE; text-decoration:none;}  /* selected link - a:active MUST come after a:hover */

/* ====== SPECIFIC ITEM SETTINGS ====== */

#menucont
{
width: 100%;
height: auto;
/* background-color: #444444; /* Default disabled */
/* background-image: url('../Images-UI/menubar-bg36.gif'); */
background-repeat: repeat-x; /* Values: repeat (Default) | no-repeat | repeat-x | repeat-y */
overflow: hidden; /* Required to make bg color show */
}

#narrowdevmenu
{
display: none;
width: 100%;
height: 36px;
/* background-color: #A40000; /* Default disabled */
background-image: url('../Images-UI/transpBlue90.png');
overflow:hidden;
}

#mainmenu
{
height: 36px;
overflow:hidden; /* Ensures div expands to fill remaining width of content area */
}

#menuleft
{
max-width: 85%; /* Leave space for menuright */
padding-left: 10px;
height: 100%;
float:left;
overflow:hidden;
}

#menuleft li
{
float: left;
}

#menuright
{
padding-right: 10px;
height: 100%;
float: right;
overflow:hidden;	
}

#menuright li
{
float: right;
}

span.smlabel
{
line-height: 24px; /* Same as smenuLineHt in menuifr.htm */
font-family: Roboto, "Open Sans", Tahoma, Geneva, Verdana, sans-serif;
font-size: 90%;
color:#3C3C3C; /* Non-link text, e.g. Sub Menu name */
}

div.smlabel
{
float: left;
}

.submenucont
{
display:none;
border-bottom: 1px solid #B1B1B1;
width: 100%;
background-image: url('../Images-UI/columnfillbg.gif');
overflow:hidden; /* Ensures div expands to fill remaining width of content area */
}

.submenuleft
{
padding-left: 10px;
height: 100%;
min-width: 70%;
overflow: hidden;
}

.submenuleftlist
{
overflow: hidden; /* Force vert alignment */
}

.submenuright
{
display: none; /* Hide */
padding-right: 10px;
height: 100%;
float: right;
overflow:hidden;
text-align: right;
}

.nav-arrow-dn
{
float: right; /* After text */
height: 0px;
width: 0px;
position: relative;
top: 16px; /* Offsets */
right: 0px;
margin-left: 4px;
border-top: 4px solid; /* Set border, color from parent */
border-left: 4px solid transparent; /* force left triangle */
border-right: 4px solid transparent; /* force right triangle */
}

img.mbicon
{
margin: 8px 8px 8px 2px;
width: 20px;
height: 20px;
float: left;
}

/* ====== Media section must come below any styles that it changes ====== */
@media all and (max-width: 840px) /* Applies while window (iframe) width below this value (not IE<9) */
{
	ul
	/* Main Menu */
	{
	font-size: 90%;
	}
		
	a, a.submenu
	{
	padding:0px 8px; /* Top & Bot / Left & Right */
	/* max-width: 64px; /* Force shortening of multi-word items */
	}
	
	#menuleft
	{
	max-width: 85%; /* Prevents menuright displacement */
	padding-left: 0px;
	}
	
	#menuright
	{
	padding-right: 0px;
	}
}

/* ====== Media section must come below any styles that it changes ====== */
@media all and (max-width: 675px) /* Applies while window (iframe) width below this value (not IE<9) */
/* Note: If max-width changed, also set 'narrowDevLimit' in menuifr.htm to same value */
{
	a
	{
	padding:0px 6px; /* Top & Bot / Left & Right */
	/* max-width: 64px; /* Force shortening of multi-word items */
	}
	
	a:hover
	{
	background-image:url('../Images-UI/transpBlack25.png');
	}
	
	#narrowdevmenu
	{
	display: block;
	}
	
	#mainmenu
	{
	height: auto;
	background-color: #777777;
	/* border-bottom: 1px solid #3C3C3C; */
	display: none;
	}
	
	ul
	/* Main Menu */
	{
	font-size: 100%;
	}
	
	#menuleft
	{
	max-width: 72%; /* Prevents menuright displacement */
	padding-left: 4px;
	}
	
	#menuleft li
	{
	min-width: 33%; /* 3 per line = 33% */
	}
	
	#menuright
	{
	padding-right: 4px;
	min-width: 70px;
	}
}

/* ====== Media section must come below any styles that it changes ====== */
@media all and (max-width: 530px) /* Applies while window (iframe) width below this value (not IE<9) */
{
	#menuleft li
	{
	min-width: 50%; /* 2 per line = 50% */
	}
}

/* ====== FADE SETTINGS (CSS3) ====== */

/* Fade-In On Load/Open */
.mfadein
{
-webkit-animation: fadein 0.5s; /* Safari, Chrome and Opera > 12.1 */
   -moz-animation: fadein 0.5s; /* Firefox < 16 */
        animation: fadein 0.5s; /* Standard, IE10+ */
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {opacity: 0;}
    to {opacity: 1;}
}

/* Standard, IE10+ */
@keyframes fadein {
    from {opacity: 0;}
    to {opacity: 1;}
}
/* Fade-In End */
