/*
 *
 * Stylesheet for ^dekoracjemarzenie.pl
 *
 * @section		screen
 * @author		Krzysztof ojniewski
 * @version		1.00
 * @copyright	zaciecie.pl
 * @media		screen
 *
 * 
 *
 * @todo 
 */
 
@import "reset.css";

body {
	background: #ddd7cc url(../img/bodybg.gif) no-repeat top center;
	font: normal 11px/16px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color: #675f5f;
}
.container { position:relative; width: 1000px; margin: 0 auto}
a { text-decoration: none}
a:hover { text-decoration: underline }
strong { font-weight: bold}
em { font-style: italic}

#header {
	position: relative;
	width: 1000px;
	height: 480px;
	background: url(../img/header_bg.jpg) no-repeat 0 0;
}
#header img, #header h2 {position: absolute;top: 50px;left: 0}
#header h2 {
	left: 180px;
	background: url(../img/header_slogan.gif) no-repeat 0 0;
	width: 179px;
	height: 39px;
	text-indent: -9999%;
	line-height: 0;
	font-size: 0;
}
#header #top-menu li { float: left}
#header ul li a {float: left;text-indent: -9999%;line-height: 0;font-size: 0}
#header #top-menu {position: absolute;right: 0; top: 50px}
#header #top-menu li a {height: 39px} 
#header #top-menu li a:hover { background-position: 0 39px }
#header #top-menu li#main a {background-image: url(../img/tm_main.gif);width: 119px}
#header #top-menu li#contact a {background-image: url(../img/tm_contact.gif);width: 92px}
#header h3 {
	position: absolute;
	background: url(../img/h3_spelniamy.gif);
	width: 205px;
	height: 20px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999%;
	right: 6px;
	top: 158px;
}
#main-menu {position: absolute;right: 6px;top: 183px;width: 205px}
#main-menu li {float: left; clear: both}
#main-menu li a {width:205px;height: 31px; font-size:0; line-height:0; overflow:hidden}
#main-menu li#car-dec a {background: url(../img/o_dekoracje.gif)}
#main-menu li#flowers a {background: url(../img/o_zywe.gif)}
#main-menu li#churches a {background: url(../img/o_wystroje.gif)}
#main-menu li#room-dec a {background: url(../img/o_dekoracje-sala.gif)}
#main-menu li#cards a {background: url(../img/m_karty.gif)}
#main-menu li#additional a {background:url(../img/o_dodatki.gif)}
#random-product {
	position: absolute;
	width: 241px;
	height: 318px;
	background: #fff url(../img/random_bg.gif) no-repeat;
	left: 16px;
	top: 129px;
	padding: 32px 43px 0 34px;
	color: #828282;
	text-align: center;
	line-height: 18px;
}
#random-product.background-0 {background-image: url(../img/random_bg_1.gif);}
#random-product.background-1 {background-image: url(../img/random_bg_2.jpg);}
#random-product.background-2 {background-image: url(../img/random_bg_3.jpg);}
#random-product.background-3 {background-image: url(../img/random_bg_4.jpg);}
#random-product.background-4 {background-image: url(../img/random_bg_5.jpg);}
#random-product a.title {
	font-weight: bold;
	color: #828282;
	width: 208px;
	background: url(../img/random_a_title_bg.gif) no-repeat 0 0;
	padding: 0 0 0px 33px;
	margin-top: 10px;
	float: left;
	text-align: left;
}
#random-product h4 {
	float: left;
	width: 100%;
	height: 16px;
	background: url(../img/h4_oferta.png) no-repeat;
	text-indent: -9999%;
	line-height: 0;
	font-size: 0;
	text-align: left;
}
*html #random-product h4 {background: url(../img/h4_oferta-8.png) no-repeat; }
#random-product img {position: static;margin: 20px 0; border: 2px solid #f3f3f3}
#random-product p {text-align: left;clear: both;display: inherit}

#content {
	width: 100%;
	clear: both;
	background: url(../img/content_bg.gif) repeat-y top right;
	float: left;
	margin-bottom: 5px;
	position: relative;
	z-index: 2
}
.company-slogan {float: left}
#content #wellcome, #content #contact-form {float: left;width: 400px}
#content #wellcome h1, #content #contact-form h1 {
	float: left;
	background: url(../img/h1_serdecznie.gif);
	width: 136px;
	height: 22px;
	margin: -33px 0 0 34px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999%;
}
#content #wellcome p, #content #contact-form p {
	float: left;
	width: 300px;
	margin: 20px 0 0 37px;
	text-indent: 10px;
	line-height: 18px;
}
#content #wellcome p strong, #content #contact-form p strong {color: #ac7782}
#quick-contact {float: right;width: 225px;padding: 15px 0 0 40px}
#quick-contact h3 {font-weight: bold;color: #8e4551}
#quick-contact img {margin: 15px 0 5px}
#content #contact-form p.alert { font-weight: bold; padding-bottom: 20px}

#footer {background: url(../img/footer_bg.gif);width: 1000px;height: 46px;color:#646363;padding-top: 15px; clear:both; position: relative}
#footer p {float: right;margin: 3px 30px 0 0}
#footer p a {font-weight: bold; color:#646363}
#footer ul {float: left;width: 275px;margin-left: 38px}
#footer ul li {float: left}
#footer ul li a {float: left;height: 24px;font-size:0;line-height:0;text-indent:-9999%}
#footer ul li#foot-contact a {background:url(../img/foot_contact.gif);width: 88px}
#footer ul li#main-page a {background: url(../img/foot_main.gif);width: 126px}


/* view product */

#view-product #header, #view-category #header {height: 431px}
#product {
	position: absolute;
	top: 129px;
	left: 16px;	
	width: 241px;
	height: 320px;
	background: #fff url(../img/random_bg.gif) no-repeat;
	padding: 32px 43px 0 34px;
	color: #828282;
	text-align: left;
	line-height: 18px;
	z-index:50;
	clear: both;
}
#view-product #product a.title {color: #8e4551;font-weight: bold}
#view-product #product .images {
	float: left;
	margin-top: 10px;
	display: block;
	width: 100%;
}
#view-product #product .images div img { display: none; margin: 0 auto;}
#view-product #product .images ul {margin-top: 10px}
#view-product #product .images li {float:left; margin-right: 10px}
#view-product #content, #view-category #content {
	margin-left: 16px;
	width: 650px;
	padding-left: 335px;
	background: #fff url(../img/content_bg.jpg) no-repeat top right;
	display: inline;
}
#view-product #quick-contact, 
#view-category #quick-contact {width:200px;margin-top:45px;padding-bottom:20px}
#opinions {float: left;width: 409px}
#opinions h3 {
	float: left;
	width: 100%;
	background: url(../img/h3_opinie.gif) no-repeat 0 0;
	height: 16px;
	text-indent: -9999%;
	font-size: 0;
	line-height: 0;
	margin-top: 15px
}
#opinions ul {float: left; width: 100%}
#opinions li {float: left;width: 180px;margin: 10px 30px 0 2px;display: inline}
#opinions li.odd { margin-right: 0}
#opinions li p {margin: 2px 0 0 2px}
#opinions li p, #opinions li strong span {color: #a2a2a2}
#opinions li strong {color:#838383}
#opinions li strong span { font-weight: normal}
#opinions .buttons {float: left;width: 100%;text-align: right;margin: 20px 0}
#opinions .buttons a {
	background: url(../img/buttons_bg.gif) repeat-x;
	text-align: center;
	font-weight: bold;
	color: #fff;
	height: 23px;
	float: right;
	padding: 2px 20px;
	margin-left: 20px;
}
#opinions .buttons a.act { color: #f2ff1a}
#opinions .add-opinion {float:left;width: 100%}
#opinions .add-opinion form {float: left;clear: both}
#opinions .add-opinion label {font-weight: bold;float: left;clear:both;padding: 5px 0}
#opinions .add-opinion input, #opinions .add-opinion textarea {
	border: 1px solid #e5e5e5;
	background: #fff;
	clear: left;
	float: left;
	width: 200px;
	padding: 2px 5px;
	font: normal 11px/16px Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color: #675f5f;
}
#opinions .add-opinion textarea {height:85px}
#opinions .add-opinion input.submit { 
	color: #fff;
	margin-top: 10px;
	width: 65px; 
	background: url(../img/buttons_bg.gif) repeat-x;
}
#opinions .add-opinion h3 {background: url(../img/h3_add-opinion.gif) no-repeat 0 0}


/* view category */
#view-category #header {z-index:51}
#view-category #category, #view-category #sub-category {float: left;width: 385px}
#view-category #category h1, #view-category #sub-category h1 {float: left;width: 300px;margin-top:20px;height: 20px}
#view-category #category ul {float: left;clear: left;width: 100%;padding: 5px 0 15px 0}
#view-category #category ul li {float:left;width: 99%;margin: 5px 0 0 1%;display: inline}
#view-category #category ul a {
	float: left;
	color: #828282;
	text-decoration: underline;
	background: url(../img/viewprodli.gif) no-repeat 0 3px;
	padding-left: 20px;
	line-height: 18px;
	font-size: 12px;
}
#view-category #category ul a:hover {color: #8e4551}
#view-category #category ul li b {font-weight: normal; color: #999999; padding-left: 5px}
#view-category #category h3, 
#view-category #sub-category h3 {float: left;width: 100%;color:#a5a5a5;font-weight:bold;margin-top: 5px}
#view-category #sub-category ul {float: left;width: 100%;padding: 10px 0 20px}
#view-category #sub-category ul li {float: left;width: 110px;margin: 10px 10px 0 0;height:120px; overflow:hidden}
#view-category #sub-category ul li.highlighted a { color: #FF6666; }
#view-category #sub-category ul li a.title {font-weight: bold;color:#818181; float:left; clear: both}
#view-category #sub-category ul li span { display: none}
#view-category #sub-category ul#product-photos {
	padding: 20px;
	display: block;
	clear: both;
	display: none;
}
#view-category #sub-category ul#product-photos li { height: auto; width: auto}
#opinions form table {clear:left}
#content #contact-form h1 { background: url(../img/h1_kontakt.gif) no-repeat 0 0}
#content #contact-form p {text-indent:0}
#content #contact-form form {
	float: left;
	clear: left;
	width: 250px;
	margin-left: 37px;
	display: inline;
	padding: 20px 0;
}
#content #contact-form form label, 
#content #contact-form form input, 
#content #contact-form form textarea {float: left;clear: left}
#content #contact-form form input, 
#content #contact-form form textarea {
	background: #fff;
	border: 1px solid #e5e5e5;
	width: 220px;
	padding: 3px 5px;
	font: normal 11px/14px Tahoma,Verdana,Arial,Helvetica,sans-serif;
	color: #838383;
}
#content #contact-form form textarea {height:85px}
#content #contact-form form input.submit {width: 70px;margin-top: 10px}
#content #contact-form form label {font-weight: bold;color: #8e4551;padding: 5px 0}
#footer .player {position: absolute;left: 300px;top: 14px}
#category p.empty {clear: both;font-style: italic;color: #666666;margin-top: 15px}
.sIFR-alternate { display: none}
#footer {float: left}
