/******************************* CSS RESET - MEYERWEB.COM *******************************/
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, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, 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;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}


/******************************* BASE CSS *******************************/
/* COMMON ELEMENTS */
.clear { clear:both }
.left { text-align:left } .center { text-align:center } .right { text-align:right }
.alignleft { float:left } .aligncenter { margin:0 auto } .alignright { float:right }
img.alignleft, table.alignleft { margin:5px 10px 5px 0 } img.alignright, table.alignright { margin: 5px 0 5px 10px }
img.aligncenter { display:block; margin: 10px auto }
.noborder { border:none; padding:0 }
.nomargin { margin:0 }
.banner { border:none; padding:0; margin-bottom:10px }
.hidden { display:none }
strong { font-weight:bold }
.spacer { clear:both; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #eee }
.spacer.double { border-bottom:3px double #ddd }
p.spacer { clear:none }
a { color: #111; text-decoration: none; }
a:hover { text-decoration: underline; }
/* BODY */
body {
	font-size:62.5%;
	font-family: Arial, Helvetica, sans-serif;
	color:#636363;
	background: #fff url(/img/header_back.jpg) repeat-x;
}


#header, #content, #footer
{
    width: 980px;
    margin: 0 auto;
}

#headerwrapper
{
    background: url(/img/header_backimage.jpg) 50% 0 no-repeat;
}
.backA { background: #a6d1f4 url(/img/header_backimageA.jpg) 100% 0 no-repeat !important; }
.backB { background: #a6d1f4 url(/img/header_backimageB.jpg) 50% 0 no-repeat !important; }
.backC { background: #72ECFB url(/img/header_backimageC.jpg) 50% 0 no-repeat !important; }
.backD { background: #72ECFB url(/img/header_backimageD.jpg) 50% 0 no-repeat !important; }
.backE { background: #FD9C11 url(/img/header_backimageE.jpg) 100% 0 no-repeat !important; }
.backF { background: url(/img/header_backimageF.jpg) 50% 0 repeat !important; }
.backG { background: url(/img/header_backimageG.jpg) 50% 0 repeat !important; }
.backH { background: url(/img/header_backimageH.jpg) 50% 0 repeat !important; }
.backI { background: #D38700 url(/img/header_backimageI.jpg) 50% 0 no-repeat !important; }
.backJ { background: #1C0A08 url(/img/header_backimageJ.jpg) 50% 0 no-repeat !important; }
#header
{
    height: 96px;
    position:relative;
}

#logo {
	position:absolute;
	top:11px;
	left:0px;
	width:178px;
	height:75px;
	background:url(/img/logo-kompas.png) no-repeat 0 0;
	text-indent:-8000px;
	border: 0;
}
#logo:hover
{
    background-position: 0 100%;
}

#search {
	position:absolute;
	bottom:11px;
	right:11px;
	width:187px;
	height:34px;
	background:url(/img/search-back.png) no-repeat 0 0;
	border: 0;
}

#search input.text
{
    border: 0 none;
    position: absolute;
    top: 8px;
    left: 8px;
    width: 144px;
    height: 16px;
    line-height: 16px;
    font-size: 1.25em;
    background-color: transparent;
}
#search input.submit
{
    border: 0 none;
    position: absolute;
    top: 4px;
    right: 4px;
    width: 29px;
    height: 25px;
    background-color: transparent;
    cursor: pointer;
    margin: 0; padding: 0;
}

.welcome
{
    background-image: url(/img/welcome.png);
    width: 286px;
    height: 40px;
    position: absolute;
    left: 200px;
    bottom: 28px;
	text-indent:-8000px;
	display: none;
}

#content
{
    overflow: hidden;
    margin-top: 20px;
}
#content #menu
{
    width: 178px;
    float: left;
    margin: 24px 0 0 4px;
}
#content #middle
{
    margin: 0 220px 0 201px;
}
#content #right
{
    width: 195px;
    float: right;
    margin: 24px 0 0 0;
}

.menu { }
.menu li { margin: 0 0 4px 0; width: 171px; }
.menu li a { height: 22px; background: url(/img/menu-back.jpg); display: block; color: #975717; text-decoration: none; line-height: 22px; font-size: 1.1em; font-weight: bold; padding: 0 15px 0 0; text-align: right; overflow: hidden; margin: 0 -3px -2px 0; }
.menu li.selected a { color: #EF3139; }
.menu li a:hover { color: #EF3139; }
.menu li ul { margin: 4px 0 8px 0; display: none; }
.menu li.selected ul { display: block; }
.menu li ul li { margin: 0 0 3px 0;  }
.menu li ul li a, .menu li.selected ul li a { width: auto; height: auto; background: none; color: #666; line-height: 14px; }
.menu li ul li.selected a { color: #111; }
.menu li ul li a:hover { color: #444; }

.breadcrumb { margin: 0 0 10px 0; height: 14px; }
.breadcrumb li { background:url("/img/separator.gif") no-repeat scroll right 5px transparent; display:inline; font-size:1.1em; line-height:1.3em;  margin:0 7px 0 0; padding-right:12px; }
.breadcrumb li a { color: #666; }

.sliderwrapper { position: relative; }
#slider { height: 225px; margin-bottom: 20px; background: url(/img/shadow_big.png) no-repeat; }
#slider li { overflow: hidden; width: 554px;  }
#slider li a { color: #f6f6f6; }
#slider li a:hover { text-decoration: none; }
#slider li h1 a:hover { text-decoration: underline; }
#slider li img { float: left; }
#slider li div.holder { margin: 0 0 0 384px; height: 220px; background: url('/img/bgCircles.png') no-repeat -60px 0; color: #f6f6f6; position: relative; }
#slider li div.holder div { bottom: 0; position: absolute; margin: 15px; }
#slider li div.holder div h1 { font-weight: normal; font-size: 1.6em; line-height: 1.4em; margin: 0 0 4px -1px;  font-family:Georgia,"Times New Roman",Times,Serif; }
#slider li div.holder p { font-size: 1.2em; line-height: 1.3em; max-height: 96px; overflow: hidden; }
#sliderprev,
#slidernext { position: absolute; top: 15px; width: 13px; height: 10px; background-image: url('/img/prevnext.png'); z-index: 100; cursor: pointer; }
#sliderprev { right: 35px; }
#slidernext { right: 15px; background-position: 13px 0; }

#okviri { overflow: hidden; }
#okviri li { background: url(/img/shadow.png) no-repeat; margin: 0 0 15px 6px; float: left; width: 182px; }
#okviri li.first { margin-left: 0; clear: left; }
#okviri li h2 { font-weight: normal; font-size: 1.6em; line-height: 1.0em; margin: 10px 0 4px 0; color: #975717; font-family:Georgia,"Times New Roman",Times,Serif; }
#okviri li h2 a { color: #975717; }
#okviri li p { font-size: 1.1em; line-height: 1.15em; margin: 0 0 3px 0; }
#okviri li p a { color: #636363; text-decoration: none; }

.okvir { margin: 0 0 12px 0; overflow: hidden; clear: both; border-bottom: solid 1px #eee; padding: 0 3px 7px; }
.okvir h3 { color:#1367AF; font-size:1.3em; line-height: 1.2em; font-weight:bold; padding: 0 10px 1px 0; margin-bottom: 2px; }
.okvir h3 a { color:#1367AF; }
.okvir img { margin: 0 12px 8px; float: right; }
.okvir p { padding: 4px 12px 5px 2px; font-size: 1.1em; line-height: 1.2em; }
.okvir ul { margin: 5px 0 5px 2px; list-style-type: disc; padding-left: 13px; font-size: 1.2em; line-height: 1.3em; color: #0C599C; }
.okvir ul li {}
.okvir ul li a { }

.izreka { font-size: 1.2em; line-height: 1.5em; font-style: italic; position: relative; padding: 10px 10px 0 50px; margin: 30px 0 0 0; color: #aaa; font-family:Georgia,"Times New Roman",Times,Serif; }
.izreka span { position: absolute; color: #DFEFFF; display: block; font-size: 700%; line-height: auto; width: 50px; top: 30px; left: 15px; font-family:Georgia,"Times New Roman",Times,Serif; }

.searchresults { margin: 20px 0; }
.searchresults li { overflow: hidden; border-bottom:1px solid #EEEEEE; margin-bottom: 10px; padding: 0 10px 10px 10px; }
.searchresults li img { display: block; float: left; }
.searchresults li h3 { padding: 0 0 0 80px; font-size: 1.4em; font-weight: normal; margin: 4px 0; }
.searchresults li h3 a { color: #1367AF; }
.searchresults li p { padding: 0 0 0 80px; font-size: 1.1em; }


#footer { margin-top: 20px; margin-bottom: 20px; border-top: 1px solid #D1D1D1; padding: 3px 0; font-size: 1.1em; text-align: center; }
#footer p { line-height: 19px; color: #666666; }
#footer img { vertical-align: sub; }
#footer p span { padding-left: 10px; }
#footer p a { color: #666666; }
#footer p a:hover { color: #444; }