@import url("lightbox.css");
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Author: Stamatis Kritikos
	Latest update: 10th of June, 2006
	©2006, www.stamatiskritikos.com
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	*** Basic Styling ***
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
html, body {
	height: 100%; /* Height Hack 1/3 */
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	We set the page background, the font color and size, 
	center the template...
	We set the relative font size of IE5-5.5 differently 
	to everything else, and we scale it from there.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
body {
	background: #ffffff;
	line-height: 1.1em;
	color: #424541;
	font-size: 12px;
	font-family: Arial, Verdana, Geneva, Helvetica, sans-serif!important;
	text-align: center; /* center template 1/2 */
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Global Whitespace Reset"
	We define padding and margin for all elements and
	we scale it from there if we need to.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
body, form, input {	
	padding: 0px;
	margin: 0px;
}
h1, h2, h4, h5, h6, p, pre, blockquote, form, label, ul, ol, dl, fieldset, address { 
	margin: 5px 0; 	
}
dd, blockquote {
	margin-left: 40px;
}
fieldset {
	padding: 10px;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Global Hyperlink Control"
	We keep the underline since users have gotten used
	to that line defining a hyperlink and we just change 
	the mouseover color.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
a:link, a:visited
{
	color: #424541;
}
a:hover
{
	color: #8a8780;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Heading Settings"
	We define font size and color mostly among some 
	other more specific things.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
h2
{
	color: #424541;
	font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
}
h1 {
	border-bottom: 1px solid #e6e8db; 
 	padding: 5px 0px 5px 10px; 
	background: #a10000 repeat;
	font-family: tahoma,Arial,sans-serif;
	font-size: 12px;
	font-weight: bold; 
	color:#FFF;
}

h2
{
	font-size: 15px;
}

h3
{
	color: #ffffff;
	background-color: #a10000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 2px 4px 2px 4px;
	margin-bottom: 4px;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Sitemap"
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
th.sitemap_heading {
	background-color: #a10000;
	padding: 2px 2px 2px 4px;
}

th.sitemap_heading a {
	color: #ffffff;
	font-size: 11px;
	text-decoration: none;
}

td.sitemap_sub {
	color: #424441;
	font-size: 10px;
}

/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Matrix Table"
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
table#matrix
{
	background-color: #f6f6f6;
	color: #8a8780;
	border-left: 1px solid #8a8780;
	border-bottom: 1px solid #8a8780;
}

table#matrix hr
{
	background-color: #8a8780;
	border: 1px solid #ffffff;	
}

table#matrix td.maintop
{
	background-color: #8a8780;
	color: #ffffff;
	text-align: center;
	border-right: 1px solid #ffffff;
}

table#matrix td.main
{
	border-top: 1px solid #8a8780;
	border-right: 1px solid #8a8780;
}

/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"About Menu"
	We define font size and color mostly among some 
	other more specific things.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

div#aboutmenu a
{
	background: url("img/arrow_aboutmenu.gif") no-repeat 2px 3px;
	color: #424541;
	font-family: tahoma,Arial,sans-serif;
	font-size: 11px;
	padding: 0px 0px 0px 15px; 
}
div#aboutmenu a:hover
{
	background: url("img/arrow_aboutmenu.gif") no-repeat 2px 3px;
	color: #8a8780;
	font-family: tahoma,Arial,sans-serif;
	font-size: 11px;
	padding: 0px 0px 0px 15px; 
}


a.headerNavigation
{
	color: #424541;
	font-family: tahoma,Arial,sans-serif;
	font-size: 11px;
	padding: 0px 0px 0px 0px; 
}
a.headerNavigation:hover
{
	color: #8a8780;
	font-family: tahoma,Arial,sans-serif;
	font-size: 11px;
	padding: 0px 0px 0px 0px; 
}


/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Global Image Control"
	We remove the border from all images and we scale it
	from there if we need to.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
img {
	border: 0;
}

/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	*** Layers Time ***
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Global Wrapper"
	This is our parent layer which includes them all.
	From here we mainly choose the width of our page.
	We made it fixed and appropriate for 800x600 res.
	However, if you change it, remember to also alter 
	the width for the "center" layer. If you wish to go
	for relative width, well... be careful.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#monster
{
	background: #fff url("img/header.jpg") no-repeat top center;
	width: 990px;
	text-align: center; /* center tabbed menu 1/2 */
	margin: 0 auto; /* center template 2/2 */
	height: 100%; /* Height Hack 2/3 */
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Tabbed Menu"
	We mainly set the width of the tabs as a whole.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#navcontainer
{
	clear: left;
	z-index: 3;
	position: relative;
	margin: 0px 0px 0px 0px; /*oben|rechts|unten|links */
	width: 990px;
	border: 0px solid #ff0000;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	The blue line below the tabs.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#tabbar
{
	position: relative;
	background: url("img/header2.jpg") no-repeat;
	clear:both;
	width: 990px;
	height: 61px;	
	margin:0;	
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	The actual tabs
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#portalshop
{
	float: left;
	margin: 50px 0px 0px 550px; /*oben|rechts|unten|links */
	border: 0px solid #00ff00;
}

* html #navlist
{
	float: left;
	text-align: left;
	margin: 110px 0px 0px 35px; /*oben|rechts|unten|links */
	border: 0px solid #00ff00;
}

#navlist
{
	float: left;
	text-align: left;
	margin: 120px 0px 0px 0px; /*oben|rechts|unten|links */
	border: 0px solid #00ff00;
}
#navlist ul,  #navlist li 
{
	list-style: none;
	margin-left: 500px;
	padding: 0;
}

*+html #navlist li
{
	list-style: none;
	margin-left: 530px;
}

#navlist li
{
	background: url("img/bg_navtop.jpg") no-repeat 0px 8px;
	display: block;
	padding-left: 10px;
	width: 24.5%;
	min-height: 20px; 
}
#navlist li a
{
	position: relative;
	display: block;
	text-align: left;
	color: #535a5f;
	text-decoration: none;
	font: bold 13px Verdana, sans-serif;
}
#navlist li a.active, #navlist li a:active
{
	padding-bottom: 5px;
	color: #535a5f; 
	background-color: transparent;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Site Logo" or "Site Header Graphic"
	You could put the site title in this div or insert
	an image in your html. If you want to place an old
	classic header to your site, define a background
	image within the "monster" div and insert a 
	transparent image within this div in your html with
	the height of your background image.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#tagline
{
	width: 160px;
	float:left;
	font: bold italic 86% Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
	color: #036;
	margin: 0;	
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Individual Tab Control"
	We make each tab a seperate div so we can have better
	control of the tabbed assembly.
	One nice trick that we achieve this way is the use
	of one image for the two edges of the menu without
	bothering altering the width of the image.
	If you want to add more tabs, just copy and paste
	the whole code of "tabb" or "tabc", give it a name of 
	your choice and remember to define it in your html.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#taba, #tabb, #tabc, #tabd {
	padding: 4px;
	background-color: transparent;
}
#taba {
	background: transparent;
	background-position: bottom left;
	padding-left: 25px;
	margin-right: -1px;
}
#tabb {
	background: transparent;
	margin-right: -1px;
	border-left: 0px solid #fff;
}
#tabc {
	background: transparent;
	margin-right: -1px;
	border-left: 0px solid #fff;
}
#tabd {
	background: transparent;
	background-position: bottom right;
	border-left: 0px solid #fff;
	padding-right: 25px;
}
#taba:hover, #tabb:hover, #tabc:hover, #tabd:hover {
	background-color: transparent;
	color: #6a7070!important;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Search Utility"
	You can remove the "search" div from your html if
	you don't want it to exist, or simply alter it's
	content.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#search {
	border-top: 2px solid #fff;
	border-bottom: 4px solid #8a8780;
	background: url("img/gradient.gif") repeat-x;
	color: #fff;
	width: 990px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: left;
}
#search label {
	font-weight: bold;
	color: #fff;
}
#search input.tbox {
	width: 45%;
}
#search input {
	padding: 1px;
	border-width: 1px;
	font: 12px Verdana, Arial, sans-serif;
	margin: 2px;
}
#search form {
	display: block;
	float: left;
	text-align: right;
	width: 70.5%;
	margin: 0 40px 0 0;
}
#search ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#search ul li {
	font: 10px/140% Verdana, Arial, sans-serif;
}
#search ul li a:link, #search ul li a:visited {
	color: #E3EDF4;
}
#search ul li a:hover {
	color: #fff!important;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Columns"
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Left Column
	"sidemenu" div is included in here.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#left {
	width: 200px;
	float: left;
	background: #f6f6f6 url("img/bg_left.gif") no-repeat center bottom;
	color: #555;
	border-right: 1px solid #ccc;
	font-size: 11px;
	text-align: left;
	line-height: 14px;
	height: 100%; /* Height Hack 3/3 */
}
#lc {
	padding: 10px;
}
* html #lc {
	width: 190px;
	padding: 10px;
	border: 0px solid #ff0000;
}
#lc p {
	padding: 0px 0px 10px 2px; /*oben|rechts|unten|links */
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Side Menu"
	Remove it from your html if you don't need it.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#sidemenu
{
	font-family: Tahoma,Arial,sans-serif;
	clear: left;
	float: left;
	width: 180px;
	margin: 0;
	padding: 0;
	font-size: 11px;
}
#sidemenu ul
{	
	list-style: none;
	width: 180px;
	margin: 0px 0px 5px 0px;
	padding: 0;
}
* html #sidemenu ul
{	
	list-style: none;
	width: 190px;
	margin: 0px 0px 5px 0px;
	padding: 0;
}

#sidemenu li
{
	margin-bottom: 0;
}
#sidemenu li a
{
	font-weight: bold;
	text-decoration: none;
	color: #505050;
}
#sidemenu li a:hover
{
	color: #8a8780;
}

#sidemenu li.cat1
{
	background: #e6e8db;
	display: block;
	padding: 5px 0px 5px 10px;
	border-left: 4px solid #8a8780;
}
#sidemenu li.cat2
{
	background: #ffffff;
	display: block;
	padding: 3px 0px 3px 10px;
	border-left: 10px solid #8a8780;
	border-bottom: 1px dashed #e6e8db;
}
#sidemenu li.cat3
{
	background: #e6e8db;
	display: block;
	padding: 2px 0px 2px 10px;
	border-left: 15px solid #8a8780;
	border-bottom: 1px dashed #e6e8db;
}
#sidemenu li.cat4
{
	background: #ffffff;
	display: block;
	padding: 2px 0px 2px 10px;
	border-left: 20px solid #8a8780;
	border-bottom: 1px dashed #e6e8db;
}
#sidemenu li.cat5
{
	background: #e6e8db;
	display: block;
	padding: 2px 0px 2px 10px;
	border-left: 23px solid #8a8780;
	border-bottom: 1px dashed #e6e8db;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Center Column
	Where the main content goes...
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/

#middlecontent
{
	float:left;
	width: 988px;
	height: auto;
	border-left: 1px solid #000;
	border-right: 1px solid #000;  
}

* html #center {
	width: 575px;
	height: auto;
	float: left;
/*  margin-left:0px;*/
	background: #f2f2f2;
	color: #666;
	line-height: 16px;
	letter-spacing: 1px;
	text-align: left;
	border: 0px solid #ff0000;
}

#center {
	width: 585px;
	height: auto;
	float: left;
/*  margin-left:0px;*/
	background: #f2f2f2;
	color: #666;
	line-height: 16px;
	letter-spacing: 1px;
	text-align: left;
	border: 0px solid #ff0000;
}

#center_1col {
	width: 990px;
	height: auto;
	float: left;
	background: #f2f2f2;
	color: #666;
	line-height: 16px;
	letter-spacing: 1px;
	text-align: left;
}

#cc {
	padding: 10px;
}
#center p {
	padding: 0 0 10px 10px;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Right Column
	Good for headlines, ads and so on...
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#right
{
	width: 200px;
	float: right;
	background: #eee url("img/bg_right.gif") no-repeat center bottom;
	line-height: 14px;
	border-left: 1px solid #ccc;
	color: #444;
	font-size: 11px;
	text-align: left;
	height: 100%; /* Height Hack 3/3 */
}
#rc {
	padding: 10px;
}
#rc p {
	padding: 0 0 10px 2px;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Footer"
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#footer {
	width: auto!important;
	background: #8a8780;
	clear: both;
	position: relative;
	text-align: center;
	font-size: 10px;
	line-height: 0.9em;
	padding: 0;
}
#footer a:link, #footer a:visited {
	color: #424242;
	font-weight: bold;
}
#footer a:hover {
	color: #1f5791!important;
	font-weight: bold!important;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	"Footer Menu"
	This could be a nice place to fill with useful 
	shortcuts of pages within your site so they'd be
	easily accessible.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
#footmenu {
	background: #424541;
	border-top: 0px solid #8a8780;
	border-left: 0px solid #fff;
	border-right: 0px solid #fff;
	color: #ADADAD;
	font: 10px Arial,Verdana,Helvetica,sans-serif;
	position: relative;
	text-align: center;
	z-index: 1;
	clear: both;
	margin: 0 0 3px 0;
	padding: 3px;
}
#footmenu a:link, #footmenu a:visited {
	color: #E3EDF4;
}
#footmenu a:hover {
	color: #fff!important;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Miscellaneous Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
.author {
	padding: 5px 0;
}
.clear {
	clear: both;
}
/*
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Forms Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
*/
fieldset {
	margin: 1em 0;
	border-top: 1px solid #ccc;
	border-bottom: none;
	border-left: none;
	border-right: none;
}
legend {
	margin: 1em 0;
	padding: 0 .5em;
	color: #069;
	background: #f7f7f7;
	font-size: 1.3em;
	font-weight: bold;
}
label {
	width: 170px;
	padding: 0 1em;
	text-align: right;
	float: left;
}
fieldset div {
	margin-bottom: .5em;
	padding: 0;
	display: block;
}
fieldset div input, fieldset div textarea {
	width: 150px;
	border-top: 1px solid #555;
	border-left: 1px solid #555;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 1px;
	color: #333;
	background-color: #eee;
}
fieldset div select {
	padding: 1px;
}
div.fm-multi div {
	margin: 5px 0;
}
div.fm-multi input {
	width: 1em;
}
div.fm-multi label {
	display: block;
	width: 200px;
	padding-left: 5em;
	text-align: left;
}
#fm-submit {
	clear: both;
	padding-top: 1em;
	text-align: center;
}
#fm-submit input {
	border: 1px solid #333;
	padding: 2px 1em;
	background: #666;
	color: #fff;
	font-size: 100%;
}
input:focus, textarea:focus {
	background: #f7f7f7;
	color: #000;
}
.copyright {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  line-height: 1.5;
  text-align:center;
}

.parseTime {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  line-height: 1.5;
  text-align:center;
}

A.copyright {
  color: #000000;
}
A.copyright:hover {
  color: #0000ff;
  text-decoration: underline;
}

.moduleRow {
 font-family: Verdana, Arial, sans-serif;
 font-size: 11px;
 line-height: 1.5;
 background-color: #E6E6E6;
 border: 1px solid;
 border-color: #E6E6E6;

}
.moduleRowOver { 
	background-color: #a10000; 
	color: #ffffff;
	border: 1px solid;
	border-color: #ffffff;
	font-family: Verdana, Arial, sans-serif;
    font-size: 11px;
    line-height: 1.5; 
}

.moduleRowSelected {
	background-color: #ffdede;
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
	line-height: 1.5;
}

TD.main, P.main {
  padding:2px;
  line-height: 1.1;
}

.tooltip {
	position: absolute;
	display: none;
	background-color: #CCF;
	border: 1px solid #66F;
	padding: 3px;
}

.productOldPrice {
	text-decoration: line-through;
	color: #ff0000;
}