
/*
                                                 
-> Project: najboljeknjige.com                    
-> Author: Igor Gotal-Luksa / Dobbin			 
-> Copyright (c) 2010: Dobbin
                   							                         
*/


/* CLEARING METHODS
----------------------------------------------------------------------------*/

	.clearfix:after { 
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0; 
		height: 0; 
		}
	
	.clearfix {
		display: inline-block; 
		}
	
	html[xmlns] .clearfix {
		display: block; 
		}
	
	* html .clearfix {
		height: 1%; 
		}
	
	.clear {
		clear: both; 
		}
		
		
/* RESET & NORMALIZE
----------------------------------------------------------------------------*/

	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
		}

	:focus {
		outline: 0;
		}

	ol, ul {
		list-style: none;
		}
		
	a {
		outline: none;
		}
		
		
/* BODY
----------------------------------------------------------------------------*/

	body {
		font: 62.5%/1.8 "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		background: #dedbd1 url("../../assets/images/site_background.gif");
		text-align: center;
		padding: 0 0 20px 0;
		}
		
		
/* LAYOUT CONTAINER & CONTENT WRAPPER
----------------------------------------------------------------------------*/

	#layout-container {
		width: 960px;
		margin: 0px auto;
		padding-bottom: 10px;
		text-align: left;
		background-color: #fff;
		border-bottom-right-radius: 3px;
		border-bottom-left-radius: 3px;
		-moz-border-radius-bottomright: 3px;  
		-moz-border-radius-bottomleft: 3px;
		-webkit-border-bottom-right-radius: 3px;
		-webkit-border-bottom-left-radius: 3px;
		}
		
		
/* HEADER
----------------------------------------------------------------------------*/

	#header {
		height: 130px;
		background: #fff url("../../assets/images/header_background.jpg") top left no-repeat;
		}

	#header h1 a {
		display: block;
		float: left;
		width: 146px;
		height: 101px;
		text-indent: -9999px;
		position: relative;
		top: 10px;
		left: 35px;
		background: url("../../assets/images/logo.png") no-repeat 0px 0px;
		}
		
	#header .banner-top {
		width: 728px;
		height: 90px;
		float: right;
		position: relative;
		right: 10px;
		top: 20px;
		}
		
		
/* MAIN NAVIGATION
----------------------------------------------------------------------------*/

	#main-navigation {
		height: 31px;
		background: url("../../assets/images/main_navigation_background.jpg") top left no-repeat;
		}
		
	#main-navigation ul {
		margin-left: 10px;
		}
		
	#main-navigation ul li {
		float: left;
		width: auto;
		}
		
	#main-navigation ul li a {
		font: normal 1.2em "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		text-decoration: none;
		width: auto;
		color: #fff;
		}
		
	#main-navigation ul li a#naslovnica {
		background: url("../../assets/images/tab_naslovnica.gif") no-repeat 0px 0px;
		width: 31px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#naslovnica:hover {
		background: url("../../assets/images/tab_naslovnica.gif") no-repeat 0px -31px;
		}
		
		
	#main-navigation ul li a#price {
		background: url("../../assets/images/tab_price.gif") no-repeat 0px 0px;
		width: 75px;
		height: 36px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		position: relative;
		top: -5px;
		}
		
	#main-navigation ul li a#price:hover {
		background: url("../../assets/images/tab_price.gif") no-repeat 0px -36px;
		}
		
	#main-navigation ul li a#vijesti {
		background: url("../../assets/images/tab_vijesti.gif") no-repeat 0px 0px;
		width: 81px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#vijesti:hover {
		background: url("../../assets/images/tab_vijesti.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#katalog-naslova {
		background: url("../../assets/images/tab_katalog_naslova.gif") no-repeat 0px 0px;
		width: 101px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#katalog-naslova:hover {
		background: url("../../assets/images/tab_katalog_naslova.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#novo-katalog {
		background: url("../../assets/images/tab_novo_katalog.gif") no-repeat 0px 0px;
		width: 161px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#novo-katalog:hover {
		background: url("../../assets/images/tab_novo_katalog.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#pregled-autora {
		background: url("../../assets/images/tab_pregled_autora.gif") no-repeat 0px 0px;
		width: 89px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#pregled-autora:hover {
		background: url("../../assets/images/tab_pregled_autora.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#top-liste {
		background: url("../../assets/images/tab_top_liste.gif") no-repeat 0px 0px;
		width: 100px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#top-liste:hover {
		background: url("../../assets/images/tab_top_liste.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#forum {
		background: url("../../assets/images/tab_forum.gif") no-repeat 0px 0px;
		width: 123px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#forum:hover {
		background: url("../../assets/images/tab_forum.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#book-trailers {
		background: url("../../assets/images/tab_booktrailers.gif") no-repeat 0px 0px;
		width: 131px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#book-trailers:hover {
		background: url("../../assets/images/tab_booktrailers.gif") no-repeat 0px -31px;
		}
		
	#main-navigation ul li a#zabava {
		background: url("../../assets/images/tab_zabava.gif") no-repeat 0px 0px;
		width: 95px;
		height: 31px;
		margin-right: 1px;
		display: block;
		text-indent: -9999px;
		}
		
	#main-navigation ul li a#zabava:hover {
		background: url("../../assets/images/tab_zabava.gif") no-repeat 0px -31px;
		}
		
		
/* SERVICE BLOCK
----------------------------------------------------------------------------*/
		
	 #service-block {
	 	height: 60px;
		margin: 10px 0 15px 0;
		background: url("../../assets/images/service_block_shadow.gif") no-repeat bottom center;
	 	}
		
		
/* SEARCH BLOCK
----------------------------------------------------------------------------*/
		
	#search-block {
		float: left;
		width: 635px;
		height: 55px;
		background: url("../../assets/images/search_bg.png") no-repeat bottom left;
		margin-left: 10px;
	 	}
		
	#search-block select {
		font: normal 1.1em "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		width: 213px;
		padding: 3px 3px 2px 3px;
		background: #fff url("../../assets/images/input_bg.gif") no-repeat top left;
		border: 1px solid #fff;
		position: relative;
		top: 21px;
		left: 75px;
	 	}
		
	#search-block input {
		font: normal 1.1em "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		width: 213px;
		padding: 4px;
		background: #fff url("../../assets/images/input_bg.gif") no-repeat top left;
		border: 1px solid #fff;
		position: relative;
		top: 20px;
		left: 82px;
	 	}
		
	#search-block .submit-button {
		width: 87px;
		height: 23px;
		background: url("../../assets/images/search_button.gif") no-repeat top left;
		position: relative;
		top: 21px;
		left: 92px;
		border: none;
		text-indent: -9999px;
		cursor: pointer;
		cursor: hand;
	 	}
		
		
/* USER BLOCK
----------------------------------------------------------------------------*/
		
	#user-block {
		font: normal 0.9em/150% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		float: right;
		width: 299px;
		height: 55px;
		margin-right: 10px;
		color: #fff;
	 	}
	.sex1 #user-block {
		background: url("../../assets/images/user_block_bg_m.png") no-repeat bottom left;
	}
	.sex2 #user-block {
		background: url("../../assets/images/user_block_bg_f.png") no-repeat bottom left;
	}
		
	#user-block-left {
		float: left;
		width: 130px;
		text-align: right;
		position: relative;
		top: 20px;
		left: 50px;
	 	}
		
	#user-block-left dd a {
		color: #f6f4b4;
		text-decoration: none;
	 	}
		
	#user-block-left dd a:hover {
		text-decoration: underline;
	 	}
		
	#user-block-right {
		float: right;
		width: 102px;
		position: relative;
		top: 20px;
	 	}
		
	#user-block-right li {
		background: url("../../assets/images/small_arrow_bullet.gif") no-repeat 0px 4px;
		padding-left: 10px;
	 	}
		
	#user-block-right li a {
		color: #fff;
		text-decoration: none;
	 	}
		
	#user-block-right li a:hover {
		color: #f6f4b4;
	 	}
		
		
/* BOOK SCROLLER
----------------------------------------------------------------------------*/

	#book-scroller-wrapper {
		background: url("../../assets/images/block_shadow_940.gif") no-repeat bottom center;
		padding-bottom: 5px;
		margin: 5px 0 15px 0;
		}
		
	#book-scroller-wraper {
		margin-left: 32px;
		z-index: 10;
		}

	#book-scroller {
		margin-left: 10px;
		}
		
	#book-scroller-title-block {
		background: url("../../assets/images/book_scroller_header_bg.gif") no-repeat bottom left;
		display: block;
		height: 30px;
		}
		
	#book-scroller-title-block h2 {
		font: normal 1.2em/150% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #fff;
		position: relative;
		top: 6px;
		left: 10px;
		}
		
	#book-scroller-block {
		width: 940px;
		border-top: 5px solid #c7c1b2;
		background-color: #d4cfc1;
		}
		
	.single-book-block {
		padding: 10px 0 10px 0;
		width: 145px;
		float: left;
		text-align: center;
		border: 0;
		border-radius: 3px;  
		-moz-border-radius: 3px;  
		-webkit-border-radius: 3px; 
		background: #fff url("../../assets/images/single_book_bg.gif") no-repeat bottom center;
		margin: 5px 1px 10px 0;
		}
		
	.single-book-block-first { /* TEMPORARY SELECTOR */
		padding: 10px 0 10px 0;
		width: 145px;
		float: left;
		text-align: center;
		border: 0;
		border-radius: 3px;  
		-moz-border-radius: 3px;  
		-webkit-border-radius: 3px; 
		background: #fff url("../../assets/images/single_book_bg.gif") no-repeat bottom center;
		margin: 5px 1px 10px 32px;
		}
		
	.single-book-block h3, .single-book-block-first h3 {
		font: normal 1.1em/130% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		margin-bottom: 10px;
		}
		
	.single-book-block h3 span, .single-book-block-first h3 span {
		font: bold 1em/100% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		}
		
	.single-book-block h4, .single-book-block-first h4 {
		font: normal 1em/130% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #d75115;
		margin-bottom: 5px;
		}
		
	.cover-thumbnail-scroll {
		margin-bottom: 10px;
		}
		
	.button-details-scroll {
		margin-bottom: 5px;
		}
		
	#scroll-navigation-left {
		position: absolute;
		margin-top: 100px;
		z-index: 20;
		cursor: hand;
		cursor: pointer;
		}
	
	#scroll-navigation-right {
		position: absolute;
		margin: 100px 0 0 890px;
		z-index: 20;
		cursor: hand;
		cursor: pointer;
		}
		
	.scroller-book-title {
		overflow: hidden;
		}

	.scroller-book-thumb {
		margin-bottom: 10px;
		overflow: hidden;
		}
		
	.scroller-book-thumb a {
		display:block;
		width:125px;
		margin:0px auto;
		}

		
/* FOOTER
----------------------------------------------------------------------------*/

	#footer {
		background: url("../../assets/images/footer_background.jpg") no-repeat bottom left;
		height: 116px;
		margin-left: 10px;
	 	}
		
	#footer ul {
		float: left;
		width: 200px;
		border-left: #8a819a 1px solid;
		position: relative;
		top: 20px;
		left: 320px;
	 	}
		
	#footer ul li {
		background: url("../../assets/images/small_arrow_bullet.gif") no-repeat 10px 7px;
		padding-left: 20px;
	 	}
		
	#footer ul li a {
		color: #fff;
		text-decoration: none;
	 	}
		
	#footer ul li a:hover {
		color: #f6f4b4;
	 	}

			
	#footer ul li.title {
		background: none !important;
	 	}
		
	#footer ul li.title h3 {
		font: bold 1.2em/150% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #f6f4b4;
		margin: 0 0 5px -11px;
	 	}
		
	#footer ul li.title h3 a {
		color: #f6f4b4;
	 	}
		
	#footer ul li.title h3 a:hover {
		color: #fff;
	 	}
		
		
/* COPYRIGHT
----------------------------------------------------------------------------*/

	#copyright {
		font: normal 1.1em/150% "Lucida Sans", "Lucida Sans Unicode", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #f5f8f9;
		position: relative;
		margin-top: 10px;
		}
	
	#copyright span {
		margin-left: 440px;
		}
	
	#copyright span a {
		color: #f6f4b4;
		text-decoration: none;
		}
		
		
/* BOOK TRAILERS - TEMP!
----------------------------------------------------------------------------*/

	#video_01 {
		margin-left: 30px;
		}

	

