/* Top Bar - Grey bar for login, account stuff, sso, etc. */
/* By Jerrold Manapat - 13-07-2012 */

#topbar {height: 53px; width: 100%; background: url(../images/main-template/bksite-MenuFooterBG.png) top left #454545; z-index: 9999;}

#topbar #container {max-width: 64.000em; height: 53px; margin: 0 auto;}
#topbar #container  ul {float: right; position: relative; top: -98px;} 
#topbar #container  ul, #topbar #container  ul li {padding: 0; margin: 0; list-style: none;}
#topbar #container  ul li {
	float: left; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
	font-size: 13px; margin-top: 7px; 
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	}
#topbar #container  ul li a {text-decoration: none; color: #FFF; padding: 7px; padding-left: 42px; padding-right: 11px; display: block;}
#topbar #container ul li b {text-decoration: none; color: #FFF; padding: 7px; padding-top: 9px; padding-left: 42px; padding-right: 11px; display: block; font-weight: normal;}

#topbar #container  li.welcome, #topbar #container  li.login, #topbar #container  li.help, #topbar #container  li.logout,
#topbar #container  li.account {border: 1px solid rgba(225,225,225,0); border-bottom: 1px solid rgba(225,225,225,0);}
#topbar #container  li.login:hover, #topbar #container  li.logout:hover, #topbar #container  li.help:hover, #topbar #container  li.account:hover { border: 1px solid #000; border-bottom: 1px solid #575757;}
#topbar #container  li.account:hover {border-bottom: none;}

#topbar #container  li.welcome {background: url(../images/main-template/topbar-welcome.png) no-repeat 5px 1px; border: 0;}
#topbar #container  li.welcome:hover,  {border: 0;}

#topbar #container  li.login {background: url(../images/main-template/topbar-login.png) no-repeat 5px 0px;}
#topbar #container  li.login:hover {background: url(../images/main-template/topbar-login.png) no-repeat 5px 0px #1d1d1d;}

#topbar #container  li.help {background: url(../images/main-template/topbar-help.png) no-repeat 5px 0px;}
#topbar #container  li.help:hover {background: url(../images/main-template/topbar-help.png) no-repeat 5px 0px #1d1d1d;}

#topbar #container  li.account {background: url(../images/main-template/topbar-account.png) no-repeat 5px 0px;}
#topbar #container  li.account:hover {background: url(../images/main-template/topbar-account.png) no-repeat 5px 0px #1d1d1d; 
	border-bottom-left-radius: 0px; 
	-moz-border-radius-bottomleft: 0px; 
	-webkit-border-radius-bottomleft: 0px;
	border-bottom-right-radius: 0px; 
	-moz-border-radius-bottomright: 0px; 
	-webkit-border-radius-bottomright: 0px;
	}
/* Account Dropdown */
#topbar #container  ul li.account ul {display: none; top: 40px;}
#topbar #container  ul li.account:hover ul {display: block; position: absolute; padding: 0; margin: 0; z-index: 9999;}
#topbar #container  ul li.account:hover ul li {margin: 0; padding: 0; background: #1d1d1d; list-style: none; padding: 0; margin: 0; border-radius: 0px;
	-moz-border-radius: 0px; -webkit-border-radius: 0px; padding-top: 10px; padding-bottom: 10px; border-bottom: #000 1px solid; margin-left: -1px;
}
#topbar #container  ul li.account:hover ul li a {
	padding: 0; margin: 0; 
	padding: 6px; 
	padding-left: 25px; 
	padding-right: 25px; 
	color: #FFF;
	text-shadow: 0 1px 1px rgba(0,0,0,0.4);
	-moz-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
	-webkit-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
	}
#topbar #container  ul li.account:hover ul li a:hover {
	background: url(../images/main-template/tab-shine.png) repeat-x top left #7ec031;
	box-shadow: 0 1px 3px rgba(0,0,0,0.75);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.75);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.75);
	}

#topbar #container  li.logout {background: url(../images/main-template/topbar-logout.png) no-repeat 5px 0px;}
#topbar #container  li.logout:hover {background: url(../images/main-template/topbar-logout.png) no-repeat 5px 0px #1d1d1d;}
#topbar #container  li.international {background: url(../images/main-template/topbar-international.png) no-repeat 5px 0px;}
#topbar #container  li.international:hover {background: url(../images/main-template/topbar-international.png) no-repeat 5px 0px #1d1d1d;}
#logo {position: relative; top: 0px; left: 15px; z-index: 1px; background: url(../images/main-template/menu-bk-container.png) no-repeat center; width: 198px; height: 102px;}
#logo a img {text-decoration: none; padding-top: 11px; padding-left: 22px;}
#google_translate_element {float: right; position: relative; top: -102px; padding: 7px; background: #1d1d1d; margin-top: 7px; border: 1px solid #000; border-bottom: 1px solid #575757; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-left: 8px; margin-right: 20px; min-width: 50px; height: 24px;}

.announcement {
    padding: 10px 50px 10px 15px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 0.9em;
    line-height: 1.5;
    background: #2D964A;
    color: #FFF;
    text-align: center;
    position: relative;
    z-index: 11000;
}
.announcement strong {color:#FFD08C;}
.announcement a {position: absolute; right: 10px; top: 14px; width: 34px; height: 34px; display: block; z-index: 9999; line-height: 34px; text-decoration: none; color: #FFF; font-weight: bold; border-radius: 100%; background: #0E5611;}