/*---------------------------------------------
[Main CSS Stylesheet]

Project:          Gornji Grad
Primary Use:      Print
Version:          1.0
Date:             18.08.2010.
Last Change:      19.08.2010.
Author:           Dimedia
---------------------------------------------*/
@import url("reset.css");

/* [Helpers] */
.fl { float: left; }
.fr { float: right; }
.cb { clear: both ; }

.tr { text-align: right; }

body {
	background: #f3f3f3 url(../images/body.png) top center no-repeat;
	color: #333333;
	font: normal normal 12px/100% Arial, sans-serif;
	text-align: center;
}

a { color: #026dcf; text-decoration: none; }

input {
	border: 1px solid #7f9db9;
}

strong { font-weight: bold; }

em { text-decoration: underline; }

.darkSide { color: #000; }

/* [Site] */
.wrapper {
	margin: auto;
	text-align: left;
	width: 980px;
}

.container {
	background: #fff url(../images/container.gif) top left repeat-x;
	padding: 0 15px 20px;
}

/* [Header] */
#header { text-indent: -9999px; height: 23px; }
		
/* [Logo Area] */
#logo-area { padding: 2px 0 5px; }
#logo-area .fl { position: relative; width: 665px; }
#logo-area .fr { display: none; }
.logo { float: left; margin: -6px 0 0 10px; }
.partner-logos { display: none; }
			
/* [Main Navigation] */
#navigation { display: none; }

/* [Search bar] */
#search-bar { display: none; }
	
/* [HomePage Banner row] */
.banner-row {
	padding: 10px 0;
	text-align: center;
}
		
/* [Footer] */
#footer { display: none; }
				
/* [Breadcrumbs] */
#breadcrumbs {
	font: normal normal 11px/17px Arial, sans-serif;
	padding: 10px 0 15px 5px;
}
	
/* [Products List Page] */
#products-list-page {
	color: #111;
	overflow: hidden;
}
	#products-list-page .plp-long { width: 100%; }
	.plp-top { padding-top: 40px; }
	.plp-left { display: none }

		
	.plp-right { float: left; width: 755px; }
		.plp-right h2 { font: normal bold 16px/100% Arial, sans-serif; padding-bottom: 5px; }
		
		.subcategory-list { padding-bottom: 20px; }
			.subcategory-list ul { overflow: hidden; }
			.subcategory-list li {
				color: #555;
				float: left;
				font-size: 13px;
				font-weight: bold;
				padding: 2px 0 3px;
				width: 290px;
			}
			
		.layout-switcher { overflow: hidden; }
			.layout-switcher a {
				color: #555;
				float: right;
				font-size: 12px;
				height: 28px;
				line-height: 28px;
				margin-left: 2px;
				padding-left: 31px;
				width: 40px;
			}
				.layout-switcher .mreza { background: url(../images/lt_mreza.gif) top left no-repeat; }
				.layout-switcher .lista { background: url(../images/lt_lista.gif) top left no-repeat; }
				.layout-switcher .active-mreza { background: url(../images/lt_mreza_active.gif) top left no-repeat; color: #cc0000; }
				.layout-switcher .active-lista { background: url(../images/lt_lista_active.gif) top left no-repeat; color: #cc0000; }
			
		.pagination-top {
			background: #eee;
			font-size: 11px;
			padding: 8px 15px 9px 9px;
			text-align: right;
		}
		
		.pagination-bottom {
			background: #eee;
			font-size: 11px;
			margin-bottom: 20px;
			overflow: hidden;
			padding: 34px 15px 9px 9px;
		}
			.pagination-top select { font-size: 11px; }
			.pagination-top label { color: #111; padding-right: 5px; }
				.pt-prikaz-ammount { padding-bottom: 11px; }
				
			.pt-bottom { overflow: hidden; }
			
		.product-pagination { float: right; }
			.product-pagination ol { overflow:hidden; }
			.product-pagination ol li { float: left; margin: 0 4px; }
				.product-pagination ol li.split-first { border-right: 1px solid #555555; padding: 0 8px; }
					.product-pagination ol li.split-first a { background: url(../images/pag_left.gif) center left no-repeat; padding-left: 15px; }
				.product-pagination ol li.split-last { border-left: 1px solid #555555; margin-right: 0; padding: 0 0 0 8px; }
					.product-pagination ol li.split-last a { background: url(../images/pag_right.gif) center right no-repeat; margin-right: 0; padding-right: 15px; }
				.product-pagination ol li a { padding: 0 2px; }
				.product-pagination ol li a.active { color: #000; }
				
		.products-list { padding: 10px 0 0; }
			.products-list table { width: 100%; }
			.products-list td { border-bottom: 1px solid #e7e7e7; color: #000; line-height: 17px; padding: 10px; text-align: left; vertical-align: top; }
			
				.products-list td.pl-img { width: 169px; vertical-align: middle; text-align: center }
				.products-list td.pl-price { text-align: left; width: 94px; }
					.products-list td.pl-price p { font-size: 11px; padding-top: 10px; color: 464646; }
				.products-list td.pl-buy { text-align: right; width: 60px; }
					.products-list td.pl-buy strong { color: #aa0000; margin-bottom: 14px; }
					.products-list td.pl-buy a {
						background: url(../images/hp_proizvod_kupi.gif) top left no-repeat;
						color: #fff;
						float: right;
						height: 19px;
						line-height: 19px;
						margin-top: 14px;
						text-align: center;
						text-decoration: none;
						width: 40px;
					}
				.products-list h3 { font-weight: bold; }
		
		.novo-upit { overflow: hidden; padding: 5px 0 0; }
			.novo-upit a {
				color: #333;
				float: left;
				margin-right: 15px;
				padding: 3px 0 3px 20px;
			}
				.g_novo { background: url(../images/green_novo.gif) center left no-repeat; }
				.g_upit { background: url(../images/green_upit.gif) center left no-repeat; }
	
	#products-list-page h1 { font: normal bold 20px/100% Arial, sans-serif; padding-bottom: 20px; }
		#products-list-page h1 span { font: normal normal 17px/100% arial, sans-serif; }
		#products-list-page h1 strong { font: normal bold 16px/100% arial, sans-serif; }
		
		.plp-top .pagination-top { margin-top: 20px; }

/* [Products Grid Page] */
.pg-row {
	background: url(../images/pg_row.gif) top center repeat-y;
	overflow: hidden;
	margin: 10px 0;
}
	.pg-row-border { border-bottom: 1px solid #e7e7e7; height: 1px; }
	.pg-product {
		float: left;
		overflow: hidden;
		padding: 0 9px 0 10px;
		width: 169px;
	}
		.pg-row .last { border-right: 0 none; }
		.pg-img {
			height: 120px;
			line-height: 120px;
			text-align: center;
		}
			.pg-img img { vertical-align: middle; }
			
		.pg-desc { line-height: 17px; padding-bottom: 10px; }
			.pg-desc h3 { font-weight: bold; padding-bottom: 5px; }			
			.pg-desc p { padding-bottom: 5px; }			
			.pg-desc a {
				color: #333;
				display: block;
				padding: 0 0 0 20px;
			}
			.pg-desc .q_novo { background: url(../images/green_novo.gif) center left no-repeat; }
			.pg-desc .q_upit { background: url(../images/green_upit.gif) center left no-repeat; }
			
		.pg-price { overflow: hidden; padding-bottom: 13px; }
			.pg-price .fr { color: #aa0000; }
			
		.pg-buy {
			color: #464646;
			font-size: 11px;
			overflow: hidden;
			padding-bottom: 10px;
		}
			.pg-buy p { float: left; }
			.pg-kupi {
				background: url(../images/hp_proizvod_kupi.gif) top left no-repeat;
				color: #fff;
				float: right;
				height: 19px;
				line-height: 19px;
				text-align: center;
				text-decoration: none;
				width: 40px;
			}

/* [Single Page] */
#single {
	color: #000;
	padding: 10px 0;
}
	#single h1 { font: normal bold 20px/100% arial; padding: 5px 0 10px; }
	#single h2 { font: normal bold 18px/100% arial; padding: 18px 0; }
	#single h4 { font: normal bold 12px/100% arial; padding: 3px 0; }
	#single p {
		line-height: 17px;
		padding: 0 0 22px;
	}
	
/* [Single Product Page] */
.product-review {
	padding-bottom: 70px;
}
	.product-review .product-image {
		border: 1px solid #eee;
		float: left;
		width: 250px;
	}
	.product-review .product-specs {
		float: left;
		padding-left: 33px;
	}
		.product-spec-fix { padding-bottom: 20px; }
		.product-spec-fix * { line-height: 19px; }
		.product-review .product-specs h1 { font-size: 18px; }
		.product-review .product-specs p { line-height: 17px; padding-bottom: 20px; }
		
	.addopt-me-please {
		border-top: 1px solid #eee;
		overflow: hidden;
		padding: 20px 0 0;
	}
		.amp-special {
			float: left;
		}
			.amp-special a {
				color: #333;
				float: left;
				margin-right: 15px;
				padding: 1px 0 1px 20px;
			}
			.amp-special span { color: #686868; display: block; font-size: 11px; padding-top: 15px; }
		.amp-pricing {
			float: left;
			padding: 0 20px;
		}
			.amp-pricing p { font-size:11px; padding-top: 12px; }
		.amp-buy {
			color: #aa0000;
			float: left;
			text-align: right;
		}
			.amp-buy a {
				display: none;
				background:url(../images/hp_proizvod_kupi.gif) no-repeat scroll left top;
				color:#FFFFFF;
				float:right;
				height:19px;
				line-height:19px;
				margin-top:16px;
				text-align:center;
				text-decoration:none;
				width:40px;
			}

.related-products {
	border: 1px solid #eee;
	border-bottom: 0 none;
	margin: 0 0 20px;
}	
	.related-products h2 {
		background: url(../images/related_products_h2.gif) top left repeat-x;
		color: #000;
		font: normal normal 17px/100% arial;
		height: 35px;
		line-height: 35px;
		padding: 0 0 0 8px;
	}
			
/* [Login Box] */
#login-box {
	background: #fff;	
	display: none;
	margin: auto;
	text-align: left;
	width: 590px;
}
	.ui-dialog {
		border: 4px solid #ddd;
	}
	.ui-dialog-titlebar {
		background: url(../images/promo_accordion_active.gif) top left repeat-x;
		color: #fff;
		height: 30px;
		line-height: 30px;
		overflow: hidden;
		padding: 0 8px 0 15px;
		text-align: left;
	}
		.ui-dialog-titlebar .ui-icon-closethick {
			background: url(../images/titlebar_close.gif) center center no-repeat;
			display: block;
			float: right;
			height: 9px;
			margin-top: 11px;
			width: 9px;
		}
	.login-body {
		overflow: hidden;
		padding: 30px 25px;
	}
		.login-body h2 {
			font: normal bold 18px/100% arial;
			padding: 0 0 20px 0;
		}
			.login-body table { width: 100% }
			.login-body td { padding: 3px; }
			.login-body td label { font: normal bold 11px/100% arial; }
			.login-body td input.login-text { width: 168px; padding: 1px 3px; }
			
			.login-body .submit {
				background:url("../images/prijava.gif") no-repeat scroll 0 0 transparent;
				border:0 none;
				color:#FFFFFF;
				height:19px;
				line-height:19px;
				text-align:center;
				width:67px;
			}
			
		.login-body .get-in {
			float: left;
			padding-right: 45px;
			width: 275px;
		}
		.login-body .join-us {
			float: left;
			width: 215px;
		}
			.join-us p {
				font: normal bold 11px/14px arial;
				padding-bottom: 11px;
			}
			.join-us .registracija {
				background:url("../images/registracija.gif") no-repeat scroll 0 0 transparent;
				border:0 none;
				color:#FFFFFF;
				display:block;
				height:19px;
				line-height:19px;
				text-align:center;
				width:109px;
			}

	.ui-widget-overlay {
		background: url(../images/overlay.png) top left repeat;
		left:0;
		position:absolute;
		top:0;
	}

/* [Register Page] */
#register-page {
	padding: 0 0 10px;
}
	#register-page h1 {
		color: #000;
		font: normal bold 20px/100% arial;
		padding: 40px 0;
	}
	.form-wrapper {
		background: #eee;
		margin-bottom: 10px;
		overflow: hidden;
		padding: 23px 0 20px 17px;
	}
		.form-wrapper h2 {
			font: normal bold 18px/100% arial;
			padding-bottom: 20px;
		}
		.form-wrapper td { padding: 2px 0; }
			.form-wrapper td.col2 { padding-left: 35px; }
			.form-wrapper td.ssubmit { padding-top: 20px; }
		.form-wrapper label {
			font-weight: bold;
			padding-right: 7px;
		}
			.form-wrapper label.mini { font-size: 11px; vertical-align:text-top; } 
			label sup {
				color: #c20000;
			}
		.form-wrapper input[type=text]{ color: #7c7c7c; }
		.form-wrapper input.text { padding: 1px 5px; width: 248px; }
		.form-wrapper input.text2 { padding: 1px 5px; width: 168px; }
		.form-wrapper input.ulica { margin: 0 2px 4px 0; padding: 1px 5px; width: 170px; }
		.form-wrapper input.kbroj { margin: 0 0px 4px 0; padding: 1px 5px; width: 61px; }
		.form-wrapper input.pbroj { margin: 0 2px 4px 0; padding: 1px 5px; width: 71px; }
		.form-wrapper input.mjesto { margin: 0 2px 4px 0; padding: 1px 5px; width: 160px; }
		.form-wrapper span.if { color: #7c7c7c; font-size: 11px; }
		
		.form-wrapper .submit {
			background: url(../images/prijava.gif) no-repeat;
			border: 0 none;
			color: #fff;
			height: 19px;
			line-height: 19px;
			text-align: center;
			width: 67px;
		}
		.form-wrapper .registracija {
			background: url(../images/registracija.gif) no-repeat;
			border: 0 none;
			color: #fff;
			display: block;
			height: 19px;
			line-height: 19px;
			text-align: center;
			width: 109px;
		}
		.total-recal input {
			background: url(../images/total_recal.gif) no-repeat;
			border: 0 none;
			color: #fff;
			height: 19px;
			text-align: center;
			width: 129px;
		}
		
	.left-form {
		float: left;
		width: 410px;
	}
		.left-form .login { padding-top: 10px; }
			a.nastavi { font-size: 11px; background: url(../images/arr_left.gif) center left no-repeat; margin-top: 3px; padding-left: 10px; }
	.right-form {
		float: left;
		width: 350px;
	}
		.right-form p {
			font-weight: bold;
			line-height: 17px;
			padding: 7px 0 15px;
		}

	#system-message {
		font-weight: bold;
		margin: 10px 20px 20px 0;
		padding: 10px;
	}
		.error-message {
			background: #eab7b7;
			border: 2px solid #a81212;			
		}
		.success-message {
			background: #cbe19c;
			border: 2px solid #5f8a04;
		}
		td.error label { color: #a81212; }
		td.error input[type=text] { background: #FFDFDF; border-color: #a81212; }
		
/* [Basket] */
#basket { width: 70% }
#basket h1 {
	color: #000;
	font: normal bold 20px/100% arial;
	padding: 10px 0 30px;
}
	#basket h1.fix { padding-bottom: 10px; }
	.table-bg {
		background: #eee;
		margin-bottom: 20px;
		padding-bottom: 10px;
	}
	table.basket-list { width: 100% }
	.table-bg td, th { padding-top: 8px; padding-bottom: 8px; }
	.basket-list td { background: #fff; border-bottom: 1px solid #eee; color: #464646; }
	.table-bg th { color: #000; font-weight: bold; }
	
	.table-bg .rbr { padding-left: 29px; width: 65px; }
	.table-bg .prtn { width: 80px; }
	.table-bg .prod { width: 345px; }
		.table-bg .prod a { font-weight: bold; color: #000; }
	.table-bg .jm { width: 40px; }
	.table-bg .qty { width: 75px; }
		.table-bg .qty input { width: 30px; padding: 1px 3px; text-align: right; }
	.table-bg .cijena { width: 90px; }
	.table-bg .rab { width: 55px; }
	.table-bg .pdv { width: 55px; }
	
	.sub-table-info {
		overflow: hidden;
		padding: 10px 0 0 30px;
	}
		.sti-left {
			float: left;
			padding-right: 45px;
			width: 625px;
		}
			.sti-left p { font-size: 11px; line-height: 17px; padding-bottom: 10px; }
				.sti-left p a { font-weight: bold; }
		.sti-right { float: left; width: 250px; }
		
	.total-recal { padding-bottom: 60px; text-align: right; }
	.basket-delivery { text-align: right; }
		.basket-delivery label { font-weight: bold; padding-right: 4px; }
		
	.sti-right table { width: 100% }
	.sti-right td {
		border-bottom: 1px solid #fff;
		padding: 3px 10px 4px;
	}
		.sti-right td strong { font-size: 11px; }
		.aa0000 { color: #aa0000; }
		.sti-right td.pre-last {
			border-bottom-color: #000;
		}
		.sti-right td.last-in-class {
			border-bottom: 0 none;
		}
		.sti-right input {
			background: url(../images/hp_proizvod_kupi.gif) top left no-repeat;
			border: 0 none;
			color: #fff;
			float: right;
			height: 19px;
			line-height: 19px;
			margin: 10px 10px 0 0;
			text-align: center;
			text-decoration: none;
			width: 40px;
		}
		
	.basket-text {
		color: #000;
		padding: 5px 0 20px;
	}
		.basket-text p { line-height: 17px; padding-bottom: 15px; }
			.basket-text p a { color: #000; text-decoration: underline; }
		.basket-text .bold { font-weight: bold; }
		.basket-text li { padding: 8px 0 8px 35px; }
		.basket-text .compact { margin-bottom: 10px; }
		.basket-text .compact li { padding: 4px 0 4px 35px; }
			.basket-text li p {
				background: url(../images/gray_bullet.gif) 0px 6px no-repeat;
				padding: 0 0 0 10px;
			}
			
		.cc-payment {
			font-size: 11px;
			font-weight: bold;
			padding: 123px 60px 0 0;
			text-align: right;
		}
		.cc-list { padding-bottom: 20px; }
		
.pred-narudzba {
	overflow: hidden;
	padding-top: 35px;
}
	.pn-left {
		float: left;
		overflow: hidden;
		padding: 0 0 40px 5px;
		width: 510px;
	}
		.pn-left img { float: left; }
		.pn-left p { float: left; padding: 25px 0 0 30px; line-height: 17px; }
	.pn-right {
		float: left;
		padding-top: 20px;
		width: 320px;
	}
		.pn-right td { padding: 2px; }
		.pn-right td.tdl { padding-right: 10px; }
.sub-pred-narudzba {
	padding-bottom: 10px;
}

/************************ LIGHTBOX ***/
#jquery-overlay               { position: absolute; top: 0; left: 0; z-index: 1000; width: 100%; height: 500px; }
#jquery-lightbox              { position: absolute; top: 0; left: 0; width: 100%; z-index: 1001; text-align: center; line-height: 0; }
#jquery-lightbox a img        { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image     { padding: 10px; }
#lightbox-loading             { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }

#lightbox-container-image-data-box                      { font-family:Arial, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data                          { padding: 0; line-height: 16px; color: #1e2d3b; font-size: 14px; }
#lightbox-container-image-data #lightbox-image-details  { width: 70%; float: left; text-align: left; }	
#lightbox-image-details-caption                         { font-weight: bold; }
#lightbox-image-details-currentNumber                   { display: block; clear: left; padding-bottom: 1.0em; font-size: 10px; line-height: 12px; color: #656565; }			
#lightbox-secNav-btnClose                               { width: 66px; float: right; padding: 0 3px 0.7em 0; font-size: 11px; font-family: Arial, sans-serif; font-weight: bold; color: #656565; text-decoration: none; background: url(../images/lightbox-btn-close.gif) right 2px no-repeat; }
#lightbox-buttons                                       { float: right; clear: right; padding-bottom: 5px; }
#lightbox-buttons img                                   { margin-left: 5px; cursor: pointer; }