/**************************
General
**************************/
body {
	background: #fff url(img/wave.gif) no-repeat top left;
	line-height: 1.5;
	font-family: Verdana,Helvetica,Arial,sans-serif;
	font-size: 11px;
	color: #16437e;
}

a:link, a:visited, a:hover, a:active, a:focus {
	color:#2f79c0;
	text-decoration:underline;
}

#header {
	background-color: transparent;
	position: relative;
}
#header-center {
	height:98px;
}

/**************************
Logo, Submenu
**************************/
#logo, #submenu {
	display:inline;
	float:left;
}
#logo {
	background: #fff url(img/hermalogo.gif) no-repeat bottom left;
	height: 40px; /* 70 */
	width: 200px;
	margin: 0em 0em 1em 0em;
}
#submenu {
	position:relative;
	float: right;
	top: 20px; /* 50 */
}
#submenu .last{
	border-right:none;
}
#submenu ul li {
	display:inline;
	border-right: 1px solid #c8dbed;
	padding-right: 5px; 
	padding-top:3px;
	padding-bottom:3px;
	color:#16437E;
}

#submenu .last {
	display:inline;
	border-right: 0px solid #c8dbed;
	padding-right: 5px; 
}
#submenu ul li a{
		text-decoration: none;
		padding-bottom: 15px;
		padding-right: 5px;
		padding-left: 5px;
		color: #16437E;		
}
#submenu ul li a:hover{
	text-decoration: underline;
}
#hotline{
	background:url(img/hotline.gif) no-repeat;
	background-position: left top;
	padding-top:3px;
	padding-right:10px !important;
	padding-bottom:3px;
	padding-left:25px;
}
#cart_left{
	background:  url(img/cart_left.gif) no-repeat center left;
	padding: 12px 0px 10px 0px;
}
#cart_right{
	background:  url(img/cart_right.gif) no-repeat center right;
	padding: 12px 0px 10px 0px;
}
#cartpositions{
	position: relative;
	padding: 10px 0px 10px 36px;
	bottom: 9px;
	right: 7px;
	color: white;
}

/**************************
Mainmenu, Toolbar
**************************/
#mainmenu ul, #toolbar{
	display: inline;
	font-weight:bold;
}
#mainmenu{
	position: relative;
}
#mainmenu_left {
	background: url(img/mainmenu_left.gif) no-repeat top left;
	height: 40px;
	padding-left:9px;
	padding-right:9px;
}
#mainmenu_right {
	background: url(img/mainmenu_right.gif) no-repeat top right;
	height: 40px;
}

#mainmenu ul li{
	position:relative;
	top: 9px;
	height: 40px;
	display: inline;
	border-right: 1px solid #4887c4;
	padding-right: 1em;
	padding-left: 1em;
	font-size: 12px;
}
#mainmenu .last{
	border-right: none;
}
#mainmenu .first {
	background:none;
}
#mainmenu ul li a {
	padding: 15px 0px 15px 0px;
	color: #dae3eb;
	text-decoration: none;
}
#mainmenu ul li a.active {
	color:white;
}
#mainmenu ul li a:hover {
	color: #ffffff;
}

#register a, #registerSSL a {
	font-weight:normal;
}

#toolbar{
	position:absolute;
	right: 25px;
	bottom: 21px;
}
#toolbar img {
	position:relative;
	top: 6px;
	padding-right: 5px;
}
#toolbar #login, #toolbar #loginSSL {
	background: transparent	 url(img/login.gif) no-repeat; 
	background-position: 5px center;
	padding: 5px 0 5px 25px;
}
#mainmenuShadow {
    /*background: url(img/mainmenu_shadow.gif) no-repeat top right;*/
    background: url(/img/schatten.jpg) no-repeat top right;
    height: 7px;
    margin-bottom: 20px;
}

/**************************
Login Dialog mainmenu jquery
**************************/
#loginDialog {
    display:none;
    background: url(img/login_dialog_bg.gif) no-repeat top right;
    height: 181px;
    width: 980px;
    margin-bottom: 20px;
}
#loginDialog h1 {
	margin-left: 520px;
	padding-top: 20px;
}

#loginDialog p {
    margin: 0px 160px 10px 520px;
}

#loginDialog div.errorSummary {
    width: 300px;
    color: #ff0000;
}

#loginDialog div.errorSummary p {
    display:none;
    margin:0px;
}

#loginFormContainer, #lostPassFormContainer {
	margin-left: 520px;
	width: 460px;
	color: #2f79c0;
}
#loginFormContainer a {
	color: #2f79c0;
}
#loginFormContainer div, #lostPassFormContainer div {
    width:160px;
    margin-bottom: 0px;
	float:left;
	padding: 3px 0px 5px 0px;
}
#lostPassFormContainer div.big, #registerFormContainer div.big {
    width:180px;
}
#loginFormContainer div.clear, #lostPassFormContainer div.clear {
    width:0px;
    margin-bottom: 0px;
	clear:both;
}
#loginFormContainer div.loginArrow, #lostPassFormContainer div.loginArrow, #registerButtonContainer div.loginArrow { 
	background: url(img/loginArrow.png) no-repeat;
	background-position:  right top;
	padding: 21px 0px 0px 0px;
	width:31px;
    margin-bottom: 0px;
}

#loginFormUsername, #loginFormPasswordPlain, #loginFormPassword {
    width: 142px;
}

#LoginForm_rememberMe div {
    margin-bottom: 0px;
}
#passwordLostLink {
	margin-left: 4px;
}
#loginFormPassword {
    display: none;
}

/**************************
Register Dialog mainmenu jquery
**************************/
#registerDialog {
    display:none;
    background:#bfdef6 url(img/register_dialog_bg.gif) no-repeat bottom right;
    height: 550px;
    width: 880px;
    margin-bottom: 20px;
    padding: 20px 50px 20px 50px;
}

#registerDialog div.errorSummary {
    position: absolute; 
    right: 10px;
    top: 198px;
    width: 250px;
    color: #ff0000;
}

#registerFormContainer div.form_column_left {
	float:left;
	margin-top:7px;
	padding-top:3px;
	width:230px;
}

#registerFormContainer div.form_column_right {
	float:left;
	margin-top:7px;
}

#registerFormContainer input {
    width: 145px;
}

#registerFormContainer input.bigPart {
    width:180px;
	margin-right: 5px;
}
#registerFormContainer input.biggerPart {
    width:287px;
	margin-right: 5px;
}
#registerFormContainer input.normalPart {
    width:180px;
	margin-right: 5px;
}
#registerFormContainer select.normalPart {
	width:188px;
	margin-right: 5px;
}
#registerFormContainer input.smallPart {
    width:94px;
	margin-right: 5px;
}
#registerFormContainer select.smallPart {
    width:102px;
	margin-right:5px;
}
#registerFormContainer div.clear {
    width:0px;
    margin-bottom: 0px;
	clear:both;
}

#registerButtonContainer {
    position: absolute; 
    right: 50px;
    width:500px;
}


/**************************
Progress Bar (TODO: in checkout.css)
**************************/
#progress ul {
	margin-top: 15px;
	list-style: none;
	font-weight:normal;
	margin-left:15px;
}
#progress{
	position: relative;
	margin-bottom: 20px;
}
#progress_left {
	background: url(img/progress_bar_left_bg.gif) no-repeat top left;
	height: 29px;
}
#progress_right {
	background: url(img/progress_bar_right_bg.gif) no-repeat top right;
	height: 29px;
}

#progress ul li{	
	float:left;
	padding-top: 5px;
	height: 29px;
	padding-right: 25px;
	padding-left: 8px;
	font-size: 11px;
	background: url(img/progress_bar_div_bg.gif) no-repeat top right;
}
#progress .last{
	border-right: none;
}
#progress .first {
	background:none;
}
#progress ul li {
	color: #a0abb8;
	text-decoration: none;
}
#progress ul li a {
	padding: 15px 0px 15px 0px;
	color: #a0abb8;
	text-decoration: none;
}
#progress ul li.active a {
	padding: 15px 0px 15px 12px;
	color: #4e688a;
	text-decoration: none;
	background: url(img/progress_bar_dot_bg.gif) no-repeat center left;
}
#progress ul li a:hover {
	text-decoration: underline;
}


/**************************
Flash-Content
**************************/
#flash{
	background: url(img/flash_content.jpg) no-repeat top left;
	/*height: 380px;*/
}
/**************************
Footer
**************************/
#footer {
	background-color:#ffffff;
	color: #737e8a;
}

#footer a {	
	color: #737e8a;
	font-size: 11px;
	text-decoration: none;
}

#footer a:hover {	
	text-decoration: underline;
}

#footer h3 {
	padding: 10px 0 10px 0;
	color: #6e84a1;
}


/**************************
Imprint
**************************/
#imprint{
	position: relative;
	padding-top: 10px;
	margin-bottom: 30px;
	font-size: 11px;
}
#allrights, #social{
	color: #737e8a;
	display: inline;
	float: left;
}

#social{
	position: absolute;
	right: 0px;
}


/**************************
Checkout Button Leiste //TODO: In ID verpacken
**************************/
.button-bar {
	height:100%;
	text-align:right;
	margin-right:14px;
	margin-top: 10px;
	margin-bottom: 15px;
	height:40px;
}
.button-bar span a, .wideBox p a {
	background: url(img/order_arrow_button.gif) no-repeat center left;
	padding:10px 10px 10px 25px;
	margin-left:35px;
	vertical-align: baseline;
	display:block;
	float:left;
	font-weight: bold;
	text-decoration: none;
	color: #123664;
}
.button-bar span a:hover {
	text-decoration: underline;
}
.button-bar .order-button {
	background: url(img/order_button.gif) no-repeat top left;
	width:182px;
	height:31px;
	text-indent: 9999px;
	display:block;
	float:right;
	overflow:hidden;
}




/**************************
Positioning
**************************/
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	width: 0;
	height: 0;
	float:none !important;
}
#outerWrapper {
	background-color: transparent;
	/*margin-left: 100px;*/
	/*margin-right: 100px;*/
}
#wrapper {
 	width : 980px;
	background-color: transparent;
	margin-left:auto;
	margin-right: auto;
}
.left, .right {
	width: 60px;
	display: inline;
	float: left;
	margin-left:10px;
	margin-right:10px;
}
.center {
	position: relative;
	width: 980px;
	display : inline;
	float: left;
	/*
	margin-left : 10px;
	margin-right: 10px;
	*/
}
.content {
	width: 1160px;
	display: inline;
	float: left;
}
.grid-1-5 {
	width: 175px;
	display: inline;
	float: left;
	padding: 0px 10px 20px 10px;
}
#footer1 {
	margin-left:12px;
}
#footer5 {
	width:120px;
}
	
.grid-1-3-left {
	width: 320px;
	display: inline;
	float: left;
	margin-right: 5px;
}
.grid-1-3-center {
	width: 320px;
	display: inline;
	float: left;
	margin-left: 5px;
	margin-right: 5px;
}
.grid-1-3-right {
	width: 320px;
	display: inline;
	float: left;
	margin-left: 5px;
}
.grid-20{
	width: 20px;
	display: inline;
	float: left;
}
.grid-90{
	width: 60px;
	display: inline;
	float: left;
	margin-right: 30px;
}
.grid-100{
	width: 80px;
	display: inline;
	float: left;
	padding: 0px 10px 0px 10px;
}
.grid-130{
	width: 80px;
	display: inline;
	float: left;
	padding: 0px 50px 0px 0px;
}
.grid-140{
	width: 100px;
	display: inline;
	float: left;
	padding: 0px 5px 0px 35px;
}
.grid-150{
	width: 120px;
	display: inline;
	float: left;
	margin-left: 30px;
}
.grid-200{
	width: 140px;
	display: inline;
	float:left;
	margin: 20px 30px 5px 30px;
}
.grid-270{
	width: 250px;
	display: inline;
	float: left;
	padding: 0px 10px 0px 10px;
}
.grid-340{
	width: 320px;
	display: inline;
	float: left;
	padding: 0px 10px 20px 10px;
}
.grid-980{
	width: 920px;
	float: left;
	margin: 0px 30px 0px 30px;
}
.grid-840{
	width: 800px;
	float: left;
	margin: 0px 30px 0px 10px;	
}
.dashedLine {
	background-image:url(/img/dashedLine.gif);
	background-repeat:repeat-x;
	height:1px;
	float:none !important;
}




/* --- jScrollPane --- */
.jScrollPaneContainer { position:relative; overflow:hidden; z-index:1; }
.jScrollPaneTrack { position:absolute; cursor:pointer; right:0; top:0; height:100%; width:9px; background:#e6e6e6; }
.jScrollPaneDrag { background:#2059a2; position:absolute; cursor:pointer; overflow:hidden; }
.jScrollPaneDragTop { }
.jScrollPaneDragBottom { }
a.jScrollArrowUp { }
a.jScrollArrowUp:hover { }
a.jScrollArrowDown { }
a.jScrollArrowDown:hover { }
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover { }


/* --- noticebox--- */
div#noticebox_big { background:url(/img/noticebox_big.png) no-repeat; display:none; height:473px; left:50%; margin:-237px 0px 0px -320px; position:fixed; top:50%; width:641px; z-index:20001; }
div#noticebox_background { background:black; display:none; height:100%; left:0px; position:absolute; top:0px; width:100%; z-index:20000; }
div.noticebox div.close { background:url(img/popUpClose.png); cursor:pointer; height:23px; position:absolute; right:41px; top:22px; width:23px; }
div.noticebox div.content  { padding:45px 50px 0px 50px; }
div.noticebox div.content div.headline_big { font-size:18px; font-weight:bold; margin-bottom:20px; }
div.noticebox div.content div.text { line-height:18px; }
div.noticebox div.content div.text a { color:#2F79C0; cursor:pointer; }
div.noticebox div.content div.text a:hover { text-decoration:underline; }
div.noticebox div.scroll-pane { height:330px; overflow:auto; width:522px; }
div.noticebox div.scroll-pane div.content { padding:0px; }
div.noticebox div.scroll-pane div.content div.textblock { margin-top:10px; }
div.noticebox div.scroll-pane div.headline { font-weight:bold; }


/* --- selectZipDropdown --- */
div#selectZipDropdown { background:white; border:1px solid #BEBEBE; padding:3px; position:absolute; text-align:left; z-index:15000; }
div#selectZipDropdown div.scroll-pane { height:100px; overflow:auto; text-align:left; width:300px; }
div#selectZipDropdown div.scroll-pane a { color:#16437E; text-decoration:none; }
div#selectZipDropdown div.scroll-pane a:hover { font-weight:bold; }
div#selectZipDropdown div.scroll-pane a.highlight { color:#2F79C0; text-decoration:underline; }