/* ----------------------------------------------
STANDARD HTML TAG RESET
----------------------------------------------- */

body, h1, h2, h3, h4, p, ul, li, form{
	border:0;
	margin:0px;
	padding:0px;
}

/* ----------------------------------------------
CLEARFIX
----------------------------------------------- */


.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%;
}

/* ----------------------------------------------
STANDARD HTML TAG DEFINITION
----------------------------------------------- */

/* ----------------------------------------------
100% height
----------------------------------------------- */

html, body{
	height: 100%;
}

/* -------------------------------------------- */

body{
	background: #878787;
	/*background: url('../img/vgrid.gif') repeat;*/
	text-align: center;
	font-size: 14px;
	line-height: 18px;
	font-family: "Utopia", "Times New Roman", Times, Georgia, serif;
}

title{
	color: #ffffff;
	font-size: 12px;
	font-family: "Courier New", Courier, monospace;
	background: #5a5a5a;
}

b{
	font-variant: small-caps;
}

br{
	line-height: inherit;
}

img{
	border: 0px;
}

a, a:active, a:link, a:visited, a:focus, a:hover{
	text-decoration: none;
}

a>img{
	text-decoration: none;
}

h1, h2, h3, h4, h5, h6, #nav{
	font-family: "Droid Serif", "DejaVu Serif", Georgia, "Times New Roman", Times, serif;
	white-space: normal;
	font-weight: normal;
}

h1{
	font-size: 30px;
	line-height: 36px;
	margin-bottom: 18px;
}

h2{
	font-size: 18px;
	line-height: 18px;
	margin-bottom: 18px;
}

h3{
	font-size: 16px;
	line-height: 18px;
	margin-bottom: 18px;
}

h4{
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 18px;
}

p:first-letter{
	text-transform: uppercase;
}

p{
	margin: 0;
	font-size: 14px;
	text-align: justify;
}

blockquote, pre{
	margin: 0;
	font-size: 10px;
	line-height: 18px;
	margin-bottom: 18px;
}

label{
	display: inline;
	top: 0px;
	margin: 0;
	font-size: 12px;
	line-height: 18px;
}

/*------------------------------------------------
CUSTOM CLASSES
--------------------------------------------------
	+ CUSTOM
	+ CSS3
	+ GRID
------------------------------------------------ */
.capitalize{
	text-transform: capitalize;
}

.lobster{
	font-family: Lobster, "Utopia", "Times New Roman", Times, Georgia, serif;
}

.small{
	font-size: 12px;
}

p.small{
	margin: 0;
	margin-bottom: 18px;
}

.table{
	display: table;
	width: 100%;
}

.tr{
	width: inherit;
	display: table-row;
}

.td{
	float: left;
	padding: 0px 10px 18px 10px;
	display: table-cell;
}

.left{
	float: left;
}

.right{
	float: right;
}

.bold{
	font-weight: bold;
}

.center{
	text-align: center;
}
 
.justify{
	text-align: justify;
}
 
.line-through{
	text-decoration: line-through;
}

.underline{
	border-bottom:1px solid #E0E0E0;
}

.uppercase{
	text-transform: uppercase;
}

.inherith{
	height: inherit;
}

.inheritw{
	width: inherit;
}

.holder{
	position: relative;
	padding: 18px 10px 18px 10px;
}

.display-block{
	display: -moz-inline-stack;
	display: inline-block;
	vertical-align: top;
	zoom: 1;
    *display: inline;
}

/* CSS3 *******************************************/

.elipsis{
	text-overflow: ellipsis-word;
	-o-text-overflow: ellipsis-word;
	overflow: hidden;
}

.hidden{
	overflow: hidden;
}

.text-shaddow{
	text-shadow: 0 1px 0 #000000;
}

.shaddow{
	box-shadow: 0px 0px 3px #878787;
	-moz-box-shadow: 0px 0px 3px #878787;
	-khtml-box-shadow: 0px 0px 3px #878787;	
	-webkit-box-shadow: 0px 0px 3px #878787;
}

.round{
	border-radius: 10px; 
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
}

.round-top{
	border-radius: 10px 10px 0px 0px;
	-moz-border-radius: 10px 10px 0px 0px;
	-khtml-border-radius: 10px 10px 0px 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
}

.round-bottom{
	border-radius: 0px 0px 10px 10px;
	-moz-border-radius: 0px 0px 10px 10px;
	-khtml-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
}

.round-right{
	border-radius: 0px 10px 10px 0px;
	-moz-border-radius: 0px 10px 10px 0px;
	-khtml-border-radius: 0px 10px 10px 0px;
	-webkit-border-radius: 0px 10px 10px 0px;
}

.round-left{
	border-radius: 10px 0px 0px 10px;
	-moz-border-radius: 10px 0px 0px 10px;
	-khtml-border-radius: 10px 0px 0px 10px;
	-webkit-border-radius: 10px 0px 0px 10px;
}

.transparent{
	opacity: .9;
}
.rotate-45{
	transform: rotate(45deg);
	-moz-transform: rotate(45deg);	
	-khtml-transform: rotate(45deg); 
	-webkit-transform: rotate(45deg);
}

/* GRID *******************************************/

.w1{
	width: 60px;
}

.w2{
	width: 120px;
}

.w3{
	width: 180px;
}

.w4{
	width: 240px;
}

.w5{
	width: 300px;
}

.w6{
	width: 360px;
}

.w7{
	width: 420px;
}

.w8{
	width: 480px;
}

.w9{
	width: 540px;
}

.w10{
	width: 600px;
}

.w11{
	width: 660px;
}

.w12{
	width: 720px;
}

.w13{
	width: 780px;
}

.w14{
	width: 840px;
}

.w15{
	width: 900px;
}

.w16{
	width: 960px;
}

.h1{
	height: 18px;
}

.h2{
	height: 36px;
}

.h3{
	height: 54px;
}

.h4{
	height: 72px;
}

.h5{
	height: 90px;
}

.h6{
	height: 108px;
}

.h7{
	height: 126px;
}

.h8{
	height: 144px;
}

.mr{
	margin-right: 10px;
}

.ml{
	margin-left: 10px;
}

.mt{
	margin-top: 18px;
}

.mb{
	margin-bottom: 18px;
}

.mb-2{
	margin-bottom: 16px;
}

.mb-4{
	margin-bottom: 14px;
}

/* ----------------------------------------------
COLOR PALETTE
----------------------------------------------- */
.background-blue{
	background: #4b9bb6;
}

.background-green{
	background: #63ae51;
}

.background-red{
	background: #d71822;
}

.background-dark-red{
	background: #a73935;
}

.background-dark{
	background: #5a5a5a;
}

.background-regular-dark{
	background: #878787;
}

.background-regular{
	background: #e0e0e0;
}

.background-light{
	background: #f6f6f6;
}

.background-white{
	background: #ffffff;
}

.border-red{
	border: 1px solid #d71822;
}

.border-dark{
	border: 1px solid #5a5a5a;
}

.border-regular-dark{
	border: 1px solid #878787;
}

.border-light{
	border: 1px solid #f6f6f6;
}

.border-regular{
	border: 1px solid #e0e0e0;
}

.border-bottom-light{
	border-bottom: 1px solid #f6f6f6;
}

.color-red{
	color: #d71822;
}

.color-blue{
	color: #4b9bb6;
}

.color-green{
	color: #63ae51;
}

.color-dark-red{
	color: #a73935;
}

.color-dark{
	color: #5a5a5a;
}

.color-regular-dark{
	color: #878787;
}

.color-regular{
	color: #e0e0e0;
}

.color-light{
	color: #f6f6f6;
}

.color-white{
	color: #ffffff;
}


/*------------------------------------------------
BODY
--------------------------------------------------
	+ Wrapper:		#wrapper
		+ Header:		#header
		+ Navigation:	#nav
		+ Main content:	#main
		+ Footer:		#footer
----------------------------------------------- */

#wrapper{
	position: relative;
	margin: 0 auto;
	width: 960px;
	height: 96%;
	text-align: left;
	padding-top: 18px;
	/*background: url('../img/960gs16.png') top left repeat-y;*/
}

#header{
	position:relative;
}

#nav{
	position:relative;
}

#sidebar{
	position:relative;
}

#main{
	position:relative;
}

#footer{
	position:relative;
}

#logo{
	position: relative;
}

/* -------------------------------------------- */

/*
 * red
a{
	color: #d71822;
}
 * blue
a{
	color: #4b9bb6;
}
 * green
a{
	color: #63ae51;
}
*/

h1{
	text-align: left;
	letter-spacing: 1px;
}

h2{
	text-transform: uppercase;
}

body{
	color: #5a5a5a;
}

a:hover{
	background-color: #f6f6f6;
}


#header{
	height: 54px;
}

#logo{
	margin-top: 2px;
	margin-left: 2px;
}

form#search{
	margin-top: 9px;
}

form#search>input#pretraga-input{
	height: 36px;
	width: 330px;
	background-color: #ffffff;
	border: 0px;
	font-size: 18px;
	font-family: "Courier New", Courier, monospace;
	padding-left: 10px;
	padding-right: 10px;
}

.search-button{
	border: 0px;
	width: 30px;
	height: 36px;
}

.search-button:hover {
	cursor: pointer;
}

.search-button.red{
	background: url('../img/red_search.png') no-repeat top left;
}

.search-button.blue{
	background: url('../img/blue_search.png') no-repeat top left;
}

.search-button.green{
	background: url('../img/green_search.png') no-repeat top left;
}

.search-button:hover.red{
    background: url('../img/red_search.png') -30px 0px no-repeat;
}

.search-button:hover.blue{
    background: url('../img/blue_search.png') -30px 0px no-repeat;
}

.search-button:hover.green{
    background: url('../img/green_search.png') -30px 0px no-repeat;
}


#detaljna-pretraga{
	position: absolute;
	z-index: 2;
	font-size: 12px;
	top: 108px;	
	right: 70px;
	padding: 0px 18px 0px 18px;
}

#detaljna-pretraga:hover{
	color: #ffffff;
	cursor: pointer;
}

#nav{
	height: 54px;
}

#nav>ul{
	padding: 18px 0 0 10px;
}

#nav>ul>li{
	position: relative;
	list-style: none;
	width: auto;
	padding: 9px;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	display: inline;
}

#knjige:hover, 
#strane-knjige:hover, 
#antikvarnica:hover,
#korpa:hover,
#pomoc:hover,
#onama:hover{
	cursor: pointer;
	font-weight: bold;
}

#nav>ul>li>a {
	color: #ffffff;
	background-color: #5a5a5a;
}

#nav>ul>li>a.active{
	color: #5a5a5a;
	background-color: #e0e0e0;
}

#main{
	margin: 0px;
	padding: 18px 10px 0px 10px;
}

h2.ml{
	margin-bottom: 0px !important;
}

.jedna-knjiga{
	width: 284px;
	height: inherit;
}

.jedna-knjiga>.opis{
	padding: 0px;
	width: 180px;
}

.jedna-knjiga>.opis>h4{
	border-bottom: 1px solid #e0e0e0;
}

.jedna-knjiga>img{
	height: 140px;
}

span.cena{
	text-decoration: underline;
}

.submit{
	border: 0;
	background-color: #5A5A5A;
}

.button:hover, .button:focus{
	background-color: #5A5A5A;
	font-weight: bold;
	cursor: pointer;
}

#knjige-akcija{
	width: 600px;
}

#knjige-akcija>h2, #knjige-prikazi>h2, #top-lista>h2{
	border-bottom: 1px solid #e0e0e0;
}

.knjige-akcija-margina{
	margin-right: 25px;
}

#top-lista{
	width: 284px;
	height: inherit;
}

.big-em{
	font-size: 36px;
	line-height: 36px;
	overflow: hidden;
}

.h1-1border{
	height: 36px;
}

#oblasti{
	padding: 10px;
}

#oblasti>div.br{
	border-right: 1px solid #878787;
	padding-left: 10px;
	padding-right: 10px;
}

#pc-press{
	font-size: 28px;
}

#footernav>ul>li{
	position: relative;
	list-style: none;
    display: inline;
	width: auto;
	padding: 9px;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
a.foota, a:active.foota, a:hover.foota, a:link.foota, a:visited.foota{
	color: #ffffff;
}

a:hover.foota, a:focus.foota{
	color: #ffffff;
	font-weight: bold;
}

a:hover.foota.red, a:focus.foota.red{
	background-color: #d71822;
}

a:hover.foota.green, a:focus.foota.green{
	background-color: #63ae51;
}

a:hover.foota.blue, a:focus.foota.blue{
	background-color: #4b9bb6;
}

a:hover.foota.dark-red, a:focus.foota.dark-red{
	background: #a73935;
}

.privremeniautor>em>i>a.autor{
	color: #5a5a5a;
	cursor: default;
}

.privremeniautor>em>i>a:hover.autor{
	background-color: transparent;
}

#biografija{
	text-align: justify;
}

#biografija br{
	margin-bottom: 18px;
}
/* -----------------------------------------------

	STRANE-KNJIGE

------------------------------------------------ */

#knjige-inostranstvo, #podaci-knjige, #podaci-narucioc{
	width:600px;
}

#knjige-inostranstvo > h2, #podaci > h2{
	border-bottom:1px solid #E0E0E0;
}

#baneri{
	height: inherit;
	width: 284px;
}

/* -----------------------------------------------

	SEARCH

------------------------------------------------ */

.suggestionsBox {
	display: block;
	position: absolute;
	left:550px;
	top:45px;
	width: 310px;
	border-top: 1px solid #fff;
	border-left: 1px solid #e0e0e0;
	border-bottom: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	background-color: #fff;
}
.suggestionList {
	display: block;
	margin: 0px;
	padding: 0px;
}
.suggestionList ul li {
	display: block;
	list-style:none;
	margin: 0px;
	padding: 5px;
	border-bottom: 1px solid #f6f6f6;
}

.lihover{
	display: block;
	text-decoration:none; 
	font-weight: bold;
	margin: 0px;
	padding: 0px;
	background-color: #878787;
	color: #f6f6f6;
	z-index:2;
	cursor: pointer;
}

/* -----------------------------------------------

	LIGHTBOX

------------------------------------------------ */


.lightbox{
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
	width: 100%;
	height: 100%;
}

.kupibox{
	display: none;
	position: absolute;
	z-index: 2000;
	width: 300px;
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.telbox{
	display: none;
	position: absolute;
	z-index: 2000;
	width: 500px;
	height: 450px;
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}


.pagenav{
	border: 1px solid #e0e0e0;
	background: #f6f6f6;
	padding: 5px 10px;
}

.pagenav:hover{
	border: 1px solid #878787;
	background: #e0e0e0;
	cursor: pointer;
}

.pagenav.disable{
	border: 1px solid #f6f6f6;
	cursor: default;
	background: #ffffff;
	color: #e0e0e0;
}

.kupibuton{
	border: 1px solid #e0e0e0;
	background: #4b9bb6;
	padding: 5px 10px;
}

.kupibuton:hover{
	border: 1px solid #878787;
	background: #186883;
	cursor: pointer;
}

.cena{
	font-size: 18px;
	font-family: Lobster, "Utopia", "Times New Roman", Times, Georgia, serif;
}

div#tabdetalji>div{
	display: inline-block;
}

.navtab{
	position: relative;
	border-left: 1px solid #878787;
	border-top: 1px solid #878787;
	border-right: 1px solid #878787;
	background: #ffffff;
	padding: 9px 10px;
	cursor: pointer;
	display: none;
}

.navtaba{
	bottom: -2px;
}

.navtabb{
	background: #e0e0e0;
}

.contab{
	border-bottom: 1px solid #f6f6f6;
}

.fh2block, .fh2{
	font-family: "Droid Serif", "DejaVu Serif", Georgia, "Times New Roman", Times, serif;
	text-transform: uppercase;
	font-size: 18px;
	line-height: 18px;
	margin-bottom: 18px;
	border-bottom:1px solid #E0E0E0;
}

#container1{
	background: #ffffff;
	border: 1px solid #878787;
	overflow-y: auto;
}

#sve_oblasti li{
	list-style: none;
	list-style-type: none;
	margin-left: 20px;
}

#sve_oblasti>ul{
	display: inline-block;
	display: -moz-inline-stack;
	vertical-align: top;
	zoom: 1;
    *display: inline;
	
	padding: 18px 10px;
	margin-right: 20px;
	margin-bottom: 10px;
	background: #f6f6f6;
	
	border-radius: 10px; 
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
}