/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body
{
    background-color: #ffffff;
    font-size: 9pt;
    font-family: Helvetica,Arial,Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969;
}

a:link
{
    color: #034af3;
    text-decoration: underline;
}
a:visited
{
    color: #505abc;
}
a:hover
{
    color: #1d60ff;
    text-decoration: none;
}
a:active
{
    color: #12eb87;
}

p, ul
{
    margin:0px;
}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
    color: #000;
    font-family: Arial, sans-serif;
}

h1
{
    font-size: 18px;
    margin:15px 0px;
    font-weight:normal;
}
h2
{
    padding: 0 0 10px 0;
    display:inline;
}
h3
{
    font-size: 1.2em;
}
h4
{
    font-size: 1.1em;
}
h5, h6
{
    font-size: 1em;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/


.page {
    width:1000px;
    overflow:auto;
    margin: 0 auto;
} 
#contentWraper { padding:0px; }	

#header { margin: 15px 0px 0px 5px; display: block; height: 110px; font-size: 24px; color: #91A4A4; font-weight: bolder; }
#logo { float:left;width:135px;text-align:left; }
#banner1 { float:left;margin: 0px 0px 0px 10px;width:850px; }

#left { width: 130px; float: left;  }
#right { float:right; width:850px;margin:0px 0px 0px 10px; }

.Content { width:695px;	border: 1px solid #aeaeae; padding:10px; margin:10px 0px; float:left;	}
	
.container { width:695px; margin: 10px auto; overflow:auto; }

#rightColumn { width:135px; float:right; }


#leftColumn { width:705px;float:left; }


#breadcrumbs { width:840px; float: left; background-color: #E2E2E2; padding: 5px; margin: 5px 0px 15px 0px; color: #808080; }
#breadcrumbs a { color: #808080; text-decoration: none; }
#breadcrumbs a:hover { color: #333333; text-decoration: underline; }

#MenuColumn { color: #333333;  font-size: 12px; margin:5px 0px; width: 132px;z-index:1;border:solid 1px #aeaeae;  }

#novostiHeader { background-color: #E2E2E2; padding: 5px; margin: 10px auto; color: #808080; width: 693px; float: left; }
#novostiHeader a { color: #333333; text-decoration: none;margin:0px 10px; }
#novostiHeader a:hover { text-decoration:underline; }

#footer { display: block; color: #999999;text-align:center;margin:15px 0;overflow:auto; }
#greska { display:block;text-align:center; font-size:1.2em; color:Red;padding:20px;  }


/* ROUNDED CORNERS, from tutorial on cssglobe.com 
--------------------------------------------------------------------*/
.roundedBox { position:relative;padding:2px;} 
	.corner { position:absolute;width:7px;height:7px;z-index:999; }
		.topLeft { top:-1px; left:-1px; background-position:0px 0px; }
		.topRight {top:-1px; right:-1px; background-position:-8px 0px;}
        .bottomLeft {bottom:-1px; left:-1px; background-position:0px -8px;}
        .bottomRight {bottom:-1px; right:-1px; background-position:-8px -8px;}
        
        .topLeft2 { top:0px; left:0px; background-position:0px 0px; }
		.topRight2 {top:0px; right:0px; background-position:-8px 0px;}
        .bottomLeft2 {bottom:0px; left:0px; background-position:0px -8px;}
        .bottomRight2 {bottom:0px; right:0px; background-position:-8px -8px;}

#MenuColumn .corner { background-image:url(images/corners.gif); }
.Content .corner { background-image:url(images/corners.gif); }
#breadcrumbs .corner {  background-image:url(images/corners2.gif); }
#novostiHeader .corner {  background-image:url(images/corners2.gif); }

/* MISC  
----------------------------------------------------------*/



.clear { clear: both; }

.ItemKat { width: 100px; height: 150px; float: left; margin: 5px 3px 15px 3px; padding: 2px;text-align:left;font-size:0.9em; }

.ItemKatImg img {  margin: auto;  }
.ItemKatImg { border-style: solid; border-width: 0px 0px 1px 0px; border-color: #C0C0C0; height: 120px; text-align: center;margin: 0px 0px 5px 0px; }
.ItemKat a { text-decoration: none; color: #333333; font-weight: normal; }

.ItemProd{ width:240px; float:left; overflow:auto; height:200px;margin:0px 20px 20px 0px; }
.ItemProd #prodNaziv { display: block; clear: both;margin: 0px 0px 0px 0px;height:30px; }
.ItemProd #prodOpis { display:block;height:130px; border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #CCCCCC;clear:both;padding:3px 0px 0px 0px; }
.ItemProd a { text-decoration: none; color: #657D96; font-weight: bold; }
.ItemProd a:hover { text-decoration:underline; }
.ItemProd img { float:left; vertical-align:text-top;margin:5px 10px 0px 0px; }

#opisPr { width:500px;float:right;margin:0px 0px 20px 0px; }

.ljevo { float:left;padding:2px 0px 0px 0px; }
.desno { float:right; }
.margina15 { margin:15px; }

.menuSection a, .menuCats a { text-decoration: none; color: #154677;}
.menuSection a:hover, .menuCats a:hover { text-decoration:underline; color: #154677; }
.menuSection { list-style-type: none;margin:3px 0px;padding:0px }
.menuSection li, .menuSection li { background-color: #ffffff; padding: 2px; color: #333333; font-weight: bold; }
.menuCats { list-style-type: none; margin: 0px 0px 0px 0px; padding: 0px; }
.menuCats li { background:#ffffff; margin:4px 0px;padding:2px 5px;font-weight: normal;font-size:1em; }

.menuCats li a { color: #4D4D4D; text-decoration: none; }
.menuCats li a:hover { text-decoration: none; color: #000000; }

/* .menuSection li:hover, .menuSection li:hover { background-color: #EEEEEE; } */

.novosti { height:300px;float:left; }

.NewsItemHome { width:205px;margin:0px 20px 0px 0px;float:left; font-size:1em; }
.NewsItemHome img { float:right;display:inline; }
.NewsItemHome h2 { display:block; font-weight:bold; font-size:1.1em;margin:0px 0px 8px 0px;padding:0px; }
.NewsItemHome h2 a { color: #484848; text-decoration: none; }
.NewsItemHome h2 a:hover { text-decoration:underline; } 

.NewsItemContainer { display:block; margin:0px 15px 25px 0px; }
.NewsItemTitle { border-style: dotted; border-width: 0px 0px 1px 0px; border-color: #C0C0C0; display: block; height: 20px; }
.NewsItemTitle h2 { float: left; color: #333333; font-size: 1.3em; font-weight: bold;padding:0px;margin:0px; }
.NewsItemTitle span { float:right; }
.NewsItem { display:block; padding:5px; }
.NewsItem p { line-height:1.6em; }
.NewsItemImg { width:120px;float:left;display:inline; }

.KatPageItem { float:left;margin: 7px 10px 20px 5px;padding:1px;text-align:left; }

.KatPageItem img { vertical-align:text-top; }
.KatPageItemKratko { color:#999999;font-size:0.9em;margin:0px 0px 5px 0px;min-height:140px;display:block; }

.KatPageItem a { border-style: solid; border-width: 0px 0px 1px 0px; border-color: #DDC8D8; color: #c8252c; font-weight: bold; font-size: 1.1em;display:block;text-decoration:none; }
.KatPageItem a:hover { color: #613045; }
.KatPageCijena { display: block; font-size: 0.8em; margin: 5px 0px; white-space: nowrap; letter-spacing:-0.02em; }
.KatPageCijena2 { display: block; font-weight:bold;white-space:nowrap;letter-spacing:-0.02em;  }
.KatPageCijenaKredit { display: block; font-weight: bold; font-size: 1.1em; color: #800000;color:#C8252C;}
.KatPageOdaberi { display: block; text-align:left; margin:5px 0px; }
.KatPageOdaberi a { border:0px; }


.KatePageItemsContainer { float:left; display:inline;border:solid 1px red;}
.KatePageDescContainer { float:right; display:inline;border:solid 1px red;}

.ProductDesc { float:left;margin:10px; }
.ProductSpecs { float:right; background-color:#F4F2F4;padding:10px;width:250px; }

#PrCijena { display:block; margin: 5px 0px; font-size:1.4em; }

.komponente { margin:20px 0px; display:block; }
.komponente span { color:#808080;font-size:14px;font-weight:bold;display:block;margin:0px 0px 10px 10px; } 
.komponente label {}
.komponente div { border: 1px solid #CCCCCC; padding: 10px; }

.basketHeader { color:#999999;font-size:1.2em;font-weight:bold; }
.basketKomponente { color: #666666; font-size:0.9em; }
.basketItem { color: #000000; font-size: 1.2em; font-weight: bolder;display:block; }

.tabInput {  }
.tabInput input[type="text"], input[type="password"] { border: 1px solid #999999; width: 200px; }
.tabInput input[type="text"]:hover, input[type="password"]:hover { border: 1px solid #525252; width: 200px; background-color: #F1F5F8; }
.tabInput label.error { float: none; color: red; padding-left: .5em;  }

#posaljiNarudzbu { margin: 4px; border-style: solid; border-width: 1px; border-color: #CCCCCC #666666 #666666 #CCCCCC; padding: 3px; font-size: 1.2em; background-color: #FAF5F7; text-decoration: none; display: block; color: #555555; width: 140px; text-align: center; }
#posaljiNarudzbu:hover { color: #000000; background-color: #F1E2E7; }

.tocekGore { border-style: dotted; border-width: 1px 00px 00px 0px; border-color: #999999; }


.kontaktDetalji { border-style: solid; border-width: 0px 0px 1px 0px; border-color: #CCCCCC; margin: 5px 0px 5px 0px; padding: 0px 0px 15px 0px; display: block; color: #999999; }

#bannerTop { float:left;height:302px;display:block;clear:both; }
#bannerMiddle { float:left;height:355px;display:block;clear:both;  }
#bannerBottom { float:left;display:block;clear:both;  }

.okvir { border:solid 1px red; }