@import "reset.css";

.cleaner { clear:both; font-size:0; line-height:0; border:0; }
.color-orange { color:#f75808 !important; }
.color-red { color:red !important; }
.color-green { color:green !important; }
.pie { behavior:url(../js/pie.htc); }
.align-right { text-align:right !important; }
.align-left { text-align:left !important; }
.align-center { text-align:center !important; }
.font-bold, .bold { font-weight:bold !important; }

html { height:100%; }
body {
	margin:0 auto; padding:0;
	text-align:center;
	font-family:Arial;
	font-size:12px;
	height:100%;
	background:#e6e6e6 url(../images/body-background.gif) repeat-y top center;
}

body a { color:#004f91; text-decoration:underline; }
body a:hover { color:#c56638; }

#toolbar { margin:0 15px; height:22px; background:url(../images/toolbar-background.gif) repeat-x top left; }

#wrap {
	margin:0 auto;
	padding:0 0 15px 0;
	width:960px;
	background:#fff url(../images/wrap-background.gif) repeat-x bottom left;
}

#header {
	height:95px;
	background:#fff url(../images/header-background.gif) repeat-x top left;
	position:relative;
}
#logo .banner { position:absolute; top:18px; left:246px; -moz-border-radius:5px; border-radius:5px; }
#logo .logo { display:block; width:196px; height:39px; position:relative; top:30px; left:30px; background:url(../images/header-logo.gif) no-repeat top left; }
#logo .logo span { display:none; }

#customer { position:absolute; top:15px; right:20px; width:200px; height:66px; text-align:left; font-size:11px; line-height:14px;}
#customer a { text-decoration:none; }
#customer .basket { display:block; background:transparent url(../images/icon-cart.gif) no-repeat 0px 5px; padding:0px 0 4px 32px; height:20px; margin:12px 0; }
#customer .user { display:block; background:transparent url(../images/icon-user.gif) no-repeat 1px 5px; padding:0px 0 4px 32px; height:20px;}

#customer span { font-weight:bold;}

/* HORIZONTAL MENU */
#menu {
	height:36px;
	margin:0 15px;
	background:url(../images/menu-background.gif) repeat-x top left;
	-moz-border-radius:5px 5px 0 0;
	border-radius:5px 5px 0 0;
	position:relative;
	border-bottom:0;
}
#menu ul.menu {
	float:left; display:block;  
}
#menu ul.menu li {
	display:inline;
	position:relative;
	float:left;
}

#menu ul.menu a {
	float:left;
	display:block;
	padding:0 20px;
	font-size:14px;
	text-decoration:none;
	color:#fff;
	line-height:36px;
	font-family:Arial;
}

#menu ul.menu li:hover, #menu ul.menu a:hover, #menu ul.menu .submenu a:hover { background:#ff8042; color:#fff !important; }
#menu ul.menu .first:hover { background:#ff8042; color:#fff !important; border-radius:5px 0 0 0; -moz-border-radius:5px 0 0 0; }



#menu ul.menu li .submenu { 
	position:absolute;
	z-index:10000; 
	left:-999em;
	background:#fff;
	margin-top:36px;
	margin-left:-1px;
	width:180px;
	border:1px solid #c56638;
	border-top:0;
	border-radius:0 0 5px 5px;
	-moz-border-radius:0 0 5px 5px;
}

#menu ul.menu li:hover .submenu { left:auto; }
#menu ul.menu .submenu { background:red; }
#menu ul.menu .submenu li {
	float:none;
	width:100%;
	display:block;
	text-align:left;
	border:0;
}

#menu ul.menu .submenu a {
	color:#00315a;
	display:block;
	height:28px;
	line-height:28px;
	font-size:12px;
	font-weight:normal;  
	border:0;
	padding:0 0 0 20px;
	width:160px;
}

#search {
	position:absolute; top:2px; right:9px; padding:4px 0;
}
#search .search {
	position:relative;
	float:left; width:150px; padding:3px 5px; 
	border:1px solid #d24602; border-right:0;
	background:url(../images/search-background.gif) repeat-x top left;
	font-size:11px; color:#555; height:15px;
	-moz-border-radius:5px 0 0 5px;
	border-radius:5px 0 0 5px;
}
#search .button {
	position:relative;
	float:right; cursor:pointer;
	width:40px; height:23px;
	border:1px solid #d24602; border-left:0; 
	background:url(../images/search-button.gif) no-repeat top left;
	font-size:11px; font-weight:bold; color:#fff;
	-moz-border-radius:0 5px 5px 0;
	border-radius:0 5px 5px 0;
}

#navigation {
	position:relative;
	clear:both; height:25px; margin:0 15px; padding:0 12px;
	text-align:left; font-size:11px; line-height:25px; color:#555;
	background:url(../images/nav-background.gif) repeat-x top left;
	border:1px solid #ddd; border-top:0;
	-moz-border-radius:0 0 5px 5px; 
	border-radius:0 0 5px 5px;
}
#navigation .home { background:url(../images/icon-home.gif) no-repeat 0px 2px; padding:0 0 0 20px; }


/* LEFT */
#content { margin:15px; }

#left {
	float:left;
	width:220px;
}

#catalog { position:relative; }
#catalog ul {
	background-color:#e0eefa;
	text-align:left; display:block;
	border:1px solid #b1d2f3; 
	-moz-border-radius:0 5px 5px 5px; 
	border-radius:0 5px 5px 5px;
	position:relative;
}

#catalog li { float:left; width:100%; background:url(../images/catalog-hover.gif) repeat-x top left; }
#catalog li a {
	display:block; height:20px; 
	padding:3px 5px 3px 30px; border-bottom:1px dotted #b1d2f3;
	line-height:20px; text-decoration:none; overflow:hidden; text-overflow:ellipsis;
	background:url(../images/arrow.png) no-repeat 9px 6px;
}

#catalog li a:hover { background-color:#f4f9fd; }
#catalog li .last { border-bottom:0 !important; -moz-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px; }
#catalog li .first {  -moz-border-radius:5px 5px 0 0; border-radius:5px 5px 0 0;  }
#catalog li.selected { background:#f4f9fd !important; } /* root */
#catalog li .selected { font-weight:bold; background-color:#f4f9fd; color:#004f91; } /* sub */

#catalog li ul { background:#fff; border:0; font-size:12px; }
#catalog li ul li { background:#fff; }
#catalog li ul a { padding-left:45px; background-position:26px 6px; border:0; }

#catalog .tab {
	top:1px;
	z-index:10;
	position:relative;
	float:left;
	font-size:13px; text-align:left; color:#004f91; font-weight:bold;
	padding:8px 12px; background-color:#fff;
	border:1px solid #b1d2f3; 
	margin:0 0px 0 0;
	cursor:pointer;
}
#catalog .tab-first {
	-moz-border-radius:5px 0 0 0;
	border-radius:5px 0 0 0;	
}
#catalog .tab-last {
	border-left:0;
	-moz-border-radius:0 5px 0 0;
	border-radius:0 5px 0 0;
}
#catalog .tab-selected { border-bottom:1px solid transparent; background-color:#dbecfb; color:#004f91; }


#tip { margin-top:15px; }
#tip h4 {
	top:1px;
	z-index:10;
	position:relative;
	float:left;
	font-size:13px; text-align:left; color:#f75808; font-weight:bold;
	padding:8px 12px; background-color:#fef0e9;
	border:1px solid #fbad88; border-bottom:0; 
	margin:0 0px 0 0;
	-moz-border-radius:5px 5px 0 0;
	border-radius:5px 5px 0 0;		
}
#tip .tip {
	clear:both;
	position:relative;
	text-align:left; display:block;
	border:1px solid #fbad88; 
	-moz-border-radius:0 5px 5px 5px; 
	border-radius:0 5px 5px 5px;
	text-align:center;
	background:url(../images/tip-background.gif) repeat-x top left;
}
#tip .tip .item { position:relative; background: url(../images/tip-background.gif) repeat-x top left; border-bottom:1px solid #fbad88; }
#tip .tip .last { border:0; -moz-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px; }
#tip .tip .first { -moz-border-radius:0 5px 0 0; border-radius:0 5px 0 0;}
#tip .tip .head { display:block; font-weight:bold; padding:10px 15px; line-height:16px; }
#tip .tip .photo { display:block; }
#tip .tip .price { color:red; font-size:15px; font-weight:bold; padding:10px; margin:0 10px; }



#newsletter { margin-top:15px; }
#newsletter h4 {
	top:1px;
	z-index:10;
	position:relative;
	float:left;
	font-size:13px; text-align:left; color:#467900; font-weight:bold;
	padding:8px 12px; background-color:#ecf5d8;
	border:1px solid #bfda81; border-bottom:0; 
	margin:0 0px 0 0;
	-moz-border-radius:5px 5px 0 0;
	border-radius:5px 5px 0 0;		
}
#newsletter .newsletter {
	clear:both;
	position:relative;
	text-align:left; display:block;
	border:1px solid #bfda81; 
	-moz-border-radius:0 5px 5px 5px; 
	border-radius:0 5px 5px 5px;
	text-align:center;
	background:url(../images/news-background.gif) repeat-x top left;
}

#newsletter .news { display:block; margin:15px 0; }
#newsletter fieldset { margin:15px;}
#newsletter .email {
	position:relative;
	float:left; width:135px; padding:3px 5px; 
	border:1px solid #bfda81; border-right:0;
	background:url(../images/search-background.gif) repeat-x top left;
	font-size:11px; color:#555; height:15px;
	-moz-border-radius:5px 0 0 5px;
	border-radius:5px 0 0 5px;
}
#newsletter .button {
	position:relative;
	float:left; cursor:pointer;
	width:40px; height:23px;
	border:1px solid #bfda81; border-left:0; 
	background:url(../images/newsletter-button.gif) no-repeat top left;
	font-size:11px; font-weight:bold; color:#708d29;
	-moz-border-radius:0 5px 5px 0;
	border-radius:0 5px 5px 0;
}





.shadow {
	-moz-box-shadow:    0px 0px 3px 1px #222;
	-webkit-box-shadow: 0px 0px 3px 1px #222;
	box-shadow:         0px 0px 3px 1px #222;
	behavior:url(../js/pie.htc);
	position:relative;
}
.shadow-menu {
	-moz-box-shadow:    2px 3px 1px 0px #ddd;
	-webkit-box-shadow: 2px 3px 1px 0px #ddd;
	box-shadow:         2px 3px 1px 0px #ddd;
	behavior:url(../js/pie.htc);
	position:relative;	
}

.shadow-content {
	border:1px solid #e9e9e9;
	-moz-box-shadow:    2px 2px 3px 0px #eee;
	-webkit-box-shadow: 2px 2px 3px 0px #eee;
	box-shadow:         2px 2px 3px 0px #eee;
	behavior:url(../js/pie.htc);
	position:relative;
	background:#fff;
}


/* RIGHT */
#right {
	float:right;
	margin:0 0 15px 15px;
	width:695px;
	text-align:left;
		line-height:16px;
}

#right h2 {
	font-size:25px;
	color:#f75808;
	margin:0 0 15px 0;
	font-family:'Open Sans Condensed';
}

#right h3 {
	font-size:22px;
	margin:15px 0 10px 0; 
	color:#015887;
	font-family:'Open Sans Condensed';
}



.index {
	border:1px solid #cce2f9;
	color:#555; 
	-moz-border-radius:5px;
	border-radius:5px;
	padding:0;
	xmax-height:300px;
	overflow:hidden;
	position:relative;
	background:#fff url(../images/index-background.gif) no-repeat bottom right;
}
.index .left { float:left; width:325px; padding:5px 10px; margin:5px 0;  }
.index .left p { line-height:17px; }
.index .left .logos { padding:10px 0 0 0; }
.index .left .logo { float:left; width:100px; padding:0 3px; }
			 
.index .right { float:left; width:320px; font-size:12px; border-left:1px dotted #b1d2f3; margin:5px 0; padding:5px 10px; }
.index h3 { margin:0px 0 15px 0 !important; }
.index .right .head { margin:10px 0 0 0; }
.index .right .head a { padding:0 5px; font-weight:bold;  }
.index .right .head span { font-weight:bold; padding:0 3px; background:#f75808; color:#fff; }
.index .right .desc { max-height:55px; font-size:11px; line-height:14px; margin:7px 0; overflow:hidden; }
.index .right .desc img { float:left; margin:0 10px 0 0; }

.products .last { margin-right:0; }
.product {
	background:#fff url(../images/product-background.gif) repeat-x bottom left;
	border:1px solid #cce2f9;
	width:340px;
	float:left;
	margin:10px 10px 0 0;	
	color:#555; 
	-moz-border-radius:5px;
	border-radius:5px;	
	position:relative;
}

.product .left { width:150px; float:left; padding:5px; } 
.product .right { width:170px; float:left; padding:5px; } 
.product .top { height:100px; overflow:hidden; }
.product .head { font-weight:bold; line-height:16px; display:block; xheight:40px; } 
.product .desc { font-size:11px; line-height:14px; width:100%; height:55px; overflow:hidden; margin-top:8px;  }
.product .bottom { margin-top:8px; padding-top:5px; border-top:1px solid #b1d2f3; }
.product .price { float:left; font-size:15px; font-weight:bold; color:red;  }
.product .price .old { font-size:12px; color:#777; line-height:18px; text-decoration:line-through; }
.product .other { float:right; font-size:11px; line-height:16px; text-align:right }
.product .avail { font-weight:bold; color:green;  }
.product .other .none { color:#ed8a27; }


#popupLogin { text-align:left; line-height:18px; color:#555; }
#popupLogin h1 { padding:5px; font-size:20px; background:#f96504; color:#fff; margin:0; border-radius:5px; -moz-border-radius:5px; }
#popupLogin p { margin:10px 0; }
#popupLogin label { display:block; width:80px; float:left; margin:6px 0; }
#popupLogin .input { border:1px solid #aaa; height:18px; padding:0px 5px; margin:6px 0; margin:1px; }
#popupLogin fieldset { margin:10px 0; padding:15px 5px; background:#e9f2fc; border-radius:5px; -moz-border-radius:5px; }

#logos { margin:15px 3px; }
#logos .logo { float:left; width:100px; padding:3px; }

#footer {
	margin:0 15px;
	padding:10px 15px;
	height:40px;
	text-align:left;
	-moz-border-radius:5px;
	border-radius:5px;	
	background:url(../images/footer-background.gif) repeat-x top left;
	color:#000; font-size:11px;
	position:relative;
	clear:both;
}

#footer .links { margin:3px 0 5px 0; }
#footer a:hover { color:#ed8a27; }
#footer .copy { margin:12px 0 0 0; }
#footer .mywac { position:absolute; right:12px; top:16px; }

.message-good, .message-bad, .message-info  {
  padding: 8px 8px 8px 35px; margin:10px 0;
  font-size:12px; line-height:18px;
  position:relative;
}
.message-good { border: 1px solid #bfda81; color: #516f1b; background: #ecf5d8 url(../images/icons/accept.png) 10px 10px no-repeat; }
.message-good a { color: #516f1b; }
.message-bad { border: 1px solid #ffdede; color: #ce0000; background: #fff1f1 url(../images/icons/exclamation.png) 10px 10px no-repeat; }
.message-bad a { color: #ce0000; }
.message-info { border: 1px solid #ededb3; background: #ffffcc url(../images/icons/information.png) 10px 10px no-repeat; }
