* { margin: 0; padding: 0; }

#content li {margin-left:20px;}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;
	background: #90cfff url(../layout/bg_body.jpg) center top repeat-x;
	text-align: center;
	min-height: 100%;
}
html { height: 100%; }

a 		{ color: #0066b3; text-decoration: underline; }
a:hover { color: #0066b3; text-decoration: none; }
p { line-height: 1.5em; }
img { border-style: none; }
hr { color: #0066b3; background-color: #0066b3;	height: 1px; border: 0;}
.clear { clear: both; } 


/* ----------------------------------------------------- */
/* ---------------------->>> WRAP <<<------------------- */
/* ----------------------------------------------------- */
#wrap { width: 990px; margin: 0 auto 20px; position: relative; text-align: left; background: url(../layout/bg_background.jpg) center top no-repeat; }
#background { width: 100%; background: url(../layout/bg_background.jpg) center top no-repeat; }
#hp_background { width: 100%; background: url(../layout/hp_header.jpg) center top no-repeat; }

#header { width: 100%; height: 138px; overflow: hidden; position: relative; }
body#homepage #header { height: 630px; background: url(../layout/hp_header.jpg) center top no-repeat; }


/* ----------------------------------------------------- */
/* -------------------->>> LOGO <<<--------------------- */
/* ----------------------------------------------------- */
#logo { position: absolute; top: 12px; left: 31px; }
	#logo a { display: block; width: 82px; height: 58px; line-height: 58px; text-align: center; overflow: hidden; position: relative; color: #0066b3; text-decoration: none; font-size: 24px; }
	#logo a span { display: block; width: 82px; height: 58px; background-image: url(../layout/logo.jpg); position: absolute; top: 0; left: 0; cursor: pointer; }

/* ----------------------------------------------------- */
/* ------------------>>> NAVIGATION <<<----------------- */
/* ----------------------------------------------------- */
#navigation { position: absolute; top: 25px; right: 265px; overflow: hidden; }
#navigation ul { font-weight: bold; list-style: none; color: #0066b3; }
#navigation ul li { display: inline; padding-left: 24px;  }
#navigation ul li.first { border-left: none; }
#navigation	ul li a { text-decoration: none; }
#navigation	ul li a:hover, #navigation ul li.active a { text-decoration: underline; }

/* ----------------------------------------------------- */
/* ------------------>>> GENERAL NAV <<<---------------- */
/* ----------------------------------------------------- */
#general_nav { width: 765px; height: 62px; padding: 9px 0 0 18px; position: absolute; top: 60px; right: 0; overflow: hidden; background: url(../layout/general_nav_bg.jpg); }
#general_nav ul { font-size: 18px; list-style: none; }
#general_nav ul li { display: block; float: left; width: 172px; height: 42px; padding-right: 12px;  }
#general_nav ul li a { display: block; float: left; width: 172px; height: 42px; line-height: 42px; text-align: center; overflow: hidden; text-decoration: none; position: relative; background-color: #dceefb; color: #0066b3; }
#general_nav ul li a:hover, #general_nav ul li a.active { text-decoration: none; color: #fff; background-color: #0066b3; }

#general_nav ul li a span { display: block; width: 172px; height: 42px; background-position: left top; position: absolute; top: 0; left: 0; cursor: pointer; }
#general_nav ul li a:hover span, #general_nav ul li a.active span { background-position: left bottom; }

	#general_nav ul li.household a span { background-image: url(../layout/general_nav_1.jpg); }
	#general_nav ul li.company a span { background-image: url(../layout/general_nav_2.jpg); }
		#general_nav ul li.company { padding-right: 11px; }
	#general_nav ul li.seniors a span { background-image: url(../layout/general_nav_3.jpg); }
	#general_nav ul li.eshop a span { background-image: url(../layout/general_nav_eshop.jpg); width: 208px; }
		#general_nav ul li.eshop { width: 208px; padding-right: 0; }
		#general_nav ul li.eshop a { width: 208px; }

/* ----------------------------------------------------- */
/* ----------------------->>> HP NAV <<<---------------- */
/* ----------------------------------------------------- */
#hp_nav { padding: 0px 0 0 28px; position: absolute; top: 520px; left: 0; overflow: hidden; }
#hp_nav ul { font-size: 18px; list-style: none; }
#hp_nav ul li { display: block; float: left; width: 292px; height: 62px; padding-right: 28px;  }
#hp_nav ul li a { display: block; float: left; width: 292px; height: 62px; line-height: 42px; text-align: center; overflow: hidden; text-decoration: none; position: relative; background-color: #dceefb; color: #0066b3; }
#hp_nav ul li a:hover, #general_nav ul li a.active { text-decoration: none; color: #fff; background-color: #0066b3; }

#hp_nav ul li a span { display: block; width: 292px; height: 62px; background-position: left top; position: absolute; top: 0; left: 0; cursor: pointer; }
#hp_nav ul li a:hover span, #general_nav ul li a.active span { background-position: left bottom; }

	#hp_nav ul li.household a span { background-image: url(../layout/hp_nav_1.jpg); }
	#hp_nav ul li.company a span { background-image: url(../layout/hp_nav_2.jpg); }
	#hp_nav ul li.seniors a span { background-image: url(../layout/hp_nav_3.jpg); }
	#hp_nav ul li.seniors { padding-right: 0px; }


/* ----------------------------------------------------- */
/* -------------------->>> HP HEADLINE <<<-------------- */
/* ----------------------------------------------------- */
#hp_header_text { width: 301px; position: absolute; top: 105px; right: 30px; }
#hp_header_text p { padding: 20px 0 16px 40px; font-size: 14px; margin-bottom: 0; }
#hp_header_text a.more { display: block; width: 54px; height: 26px; padding-right: 7px; margin-left: 36px; background: url(../layout/box_delivery_more.gif); line-height: 26px; overflow: hidden; text-align: center; text-decoration: none; font-weight: bold; overflow: hidden; }

#hp_headline { width: 301px; height: 71px; overflow: hidden; font-size: 26px; text-transform: uppercase; position: relative; }
#hp_headline span { display: block; width: 301px; height: 71px; background: url(../layout/hp_headline.jpg); position: absolute; top: 0; left: 0; }
	#hp_headline strong { font-weight: normal;}
		#hp_headline strong.s_orange 	{ color: #f26522; }
		#hp_headline strong.s_green 	{ color: #71bf44; }
		#hp_headline strong.s_blue 		{ color: #0066b3; }
		#hp_headline strong.s_yellow 	{ color: #fdb813; }

/* ----------------------------------------------------- */
/* -------------------->>> SEARCH <<<------------------- */
/* ----------------------------------------------------- */
#search { width: 211px; height: 25px; overflow: hidden; position: absolute; right: 9px; top: 18px; background: url(../layout/search_bg.jpg); }
#search form { padding: 4px 0 0 0; }
#search label { display: block; float: left; width: 32px; height: 20px; }
#search input.text {  width: 96px; height: auto; padding: 0px 0px; margin: 0; background: none; border: none; color: #0066b3; font-weight: normal; }
#search input.button { width: 68px; height: auto; font-weight: bold; color: #0066b3; border: none; background: none; margin: 0; padding: 0; text-align: center;  background: url(../layout/search_button.gif) right no-repeat;}


/* ----------------------------------------------------- */
/* --------------->>> BUTTON ESHOP <<<----------------- */
/* ----------------------------------------------------- */
a#button_eshop { display: block; width: 218px; height: 62px; overflow: hidden; position: absolute; right: 9px; top: 10px; }
a#button_eshop span { display: block; width: 218px; height: 62px; position: absolute; left: 0px; top: 0px; background: url(../layout/button_eshop.jpg) left top; cursor: pointer; }
a#button_eshop:hover span { background: url(../layout/button_eshop.jpg) left bottom; }


/* ----------------------------------------------------- */
/* -------------------->>> COLUMNS <<<------------------ */
/* ----------------------------------------------------- */
#big_left 	{ float: left; width: 745px; overflow: hidden; }
	#left 		{ float: left; width: 217px; padding-top: 0px; overflow: hidden; } 
	#content 	{ float: right; width: 520px; min-height: 640px; padding-bottom: 20px; overflow: hidden; }
	#content ul li 	{ margin-left:25px;}
#right 		{ width: 228px; float: right; padding: 41px 0 20px; overflow: hidden; }

/* ----------------------------------------------------- */
/* -------------------->>> FOOTER <<<------------------- */
/* ----------------------------------------------------- */
#footer { width: 100%; height: 172px; padding-top: 82px; background: url(../layout/bg_footer.png) top center no-repeat; text-align: left; position: relative; }
#footer .cnt { width: 990px; height: 172px; margin: 0 auto; }

	ul#footer_nav 			{ list-style: none; color: #fff; padding: 28px 0 26px; font-weight: bold; text-align: right; }
	ul#footer_nav li 		{ display: inline; padding-left: 28px; }
	ul#footer_nav li a 		{ color: #fff; text-decoration: none; }
	ul#footer_nav li a:hover,
	ul#footer_nav li.active a 	{ color: #fff; text-decoration: underline; }
	
	p#copyright { color: #75b1de; text-align: right; }
	p#copyright a { color: #75b1de; text-decoration: none; }
	p#copyright a:hover { color: #75b1de; text-decoration: underline; }
	p#copyright span { padding: 0 10px; }
	p#copyright img { vertical-align: middle; }