/************************************************
Puppis - CSS file
Copyright (C) by martina[at]webstudio, 2oo8
************************************************/
/******************* GENERAL STUFF *************/
* 												{ margin: 0; padding: 0; }

html        									{ font: 62.5%/1.5 Arial, Helvetica, sans-serif; color: #4f4c42; height: 100%; margin: 0 0 1px; }
body        									{ background: #e2e2e2 url(../layout/background.gif) repeat-x;}

a           									{ text-decoration: none; color: #267daf; }
a:focus	   										{ color: #1a4f06; }
a:hover     									{ color: #0066a1; }
a:hover,
a:active    									{ outline: none; }

a img      										{ border: 0; }

h1,
h2,
h3,
h4  											{ font-weight: normal; }

input,
textarea,
select      									{ color: #4f4c42; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 1.4em; }
fieldset    									{ border-style:none; }
legend      									{ display:none;}

.skip_to										{ position: absolute; left: -999em; overflow: hidden; }
.image-floatLeft 								{ float: left; }
ul												{ list-style: inside; margin-bottom: 20px}

.unordered-list  								{ list-style: none; margin: 0px 0px 0px 15px; padding: 1px; }
.unordered-list li  							{ margin-bottom: 6px; color: #2B6D8E; list-style: circle inside; }
.linkzRight			 							{ text-align: right!important; margin: 0px 3px 0px 1px; }

.required 										{ color:#f00; }

form											{ margin:0px; }
.clearer										{ height: 0; width: 0;	line-height: 0;	font-size: 0; overflow: hidden; clear: both;}


/******************* CONTAINERS ****************/
#contentWrapper 								{ background: #f7f7f7 url(../layout/background.gif) repeat-x; width: 100%; }
#container										{ width:962px; margin:0px auto;	font-size: 1.1em; background: #fff; padding: 4px 4px 0px; }
/******************* CONTAINERS ****************/

/******************* HEADER ********************/
#header											{ height:179px; position:relative; background: url(../layout/headerBg.gif) no-repeat; margin: 0px auto; 	width: 970px;font-size: 1.1em;  }

h1#puppisLogo									{ background: url(../layout/puppisLogo.gif) no-repeat; position: absolute; height: 106px; width: 95px; top: 6px; left: 8px; }
h1#puppisLogo a									{ text-indent: -999em; display: block; border:none; height: 106px; line-height: 1px; width: 250px; }


#header .languages 								{ background: url(../layout/languageBg.gif) no-repeat; height: 19px; width: 100px; position: absolute; top: 5px; right: 0px; text-align: center; padding-top: 2px; }
#header .languages a 							{ text-transform: uppercase; color: #fff; padding-right: 6px; padding-left: 6px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }

/******************* navigation ****************/
#navigation										{ list-style-type: none; height: 30px; position: absolute; left: 159px; top: 88px; background: url(../layout/navigationBg.gif) repeat-x; }
#navigation li									{ float: left; display: inline; width: auto !important; margin: 0px; }
#navigation li a								{ display: block; text-decoration: none; color: #fff; padding: 9px 14px 8px; text-transform: uppercase; font: bold 1.1em/1 Arial, Helvetica, sans-serif; border-right: 1px solid #fff; }
/******************* navigationLevels **********/
#navigation li ul 								{ height: auto !important; min-height: 24px; position: absolute; background: #fff; width: 180px; left: -999em; padding:0px;border-top: 1px solid #d9e8f1; border-right: 1px solid #d9e8f1;}		
#navigation li ul li 							{ line-height: 24px; margin: 0px; border-bottom: 1px solid #d9e8f1;border-left: 3px solid #d9e8f1; }
#navigation li ul a 							{ color: #fff; text-decoration: none; width: 174px; display: block; margin: 0px; padding: 0px 0px 0px 3px; background: #3991bd url(none)!important; text-align:left!important; text-indent:1px; border-right:none!important; text-transform: none; font-size: 1.1em; font-style: normal; line-height: 24px; font-weight: normal; font-variant: normal;}

#navigation li:hover, 
#navigation li.sfhover 							{ background: url(none) repeat-x; }

#navigation li ul a:hover 						{ color: #3991bd; background: #fff url(none)!important; width: 174px; margin: 0px; padding: 0px 0px 0px 3px;  line-height:24px;}
#navigation li ul ul 							{ margin: -24px 0 0 177px; font-size: 1em;}
#navigation li ul ul li							{ border-left: 1px solid #d9e8f1;}
#navigation li ul ul a							{ background: #3991bd url(none)!important; color:#fff; width: 176px; }							
#navigation li ul ul a:hover					{ background: #fff; width: 176px;}
#navigation li:hover ul ul, 
#navigation li.sfhover ul ul 					{ left: -999em;}

#navigation li:hover ul, 
#navigation li li:hover ul, 
#navigation li.sfhover ul, 
#navigation li li.sfhover ul 					{ left: auto;}

#navigation li ul:hover, 
#navigation li ul.sfhover, 
#navigation li ul li:hover, 
#navigation li ul li.sfhover					{ background: #fff url(none); }

/******************* navigationLevels **********/

/******************* navigation ****************/
/******************* HEADER ********************/

/******************* SIDE CONTENT **************/
#sideContent									{ float:left; width:220px; display:inline; }

/******************* PUPPIS SAVJETUJE **********/
#puppisSavjetuje								{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede; margin-bottom: 4px; padding-bottom: 2px; width:220px;}
#puppisSavjetuje h2 							{ background: url(../layout/puppisSavjetujeTitle.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 25px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }

.savjet											{ background: #f6f6f6; margin: 0px 5px 2px; padding: 7px 7px 5px; }
.savjet h3 										{ color: #267daf; font-size: 1.1em; font-weight: bold; }
.savjet .date 									{ display: block; text-align: right; font-size: 0.9em; color: #4a4a4a; }

#puppisSavjetuje .archiveLnk 					{ text-align: center; display: block; padding: 4px 0px;	background: url(../layout/archiveLnk.gif) repeat-x;	margin: 0px 3px; }
#puppisSavjetuje .archiveLnk a 					{ text-transform: uppercase; color: #fff; font-weight: bold; padding: 3px 6px; }

/******************* PUPPIS SAVJETUJE **********/

#sideMenu										{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede; margin-bottom: 4px; padding-bottom: 2px; width:220px;}
#sideMenu h2 									{ background: url(../layout/sideMenuTitle.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 25px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.sideMenu										{ width: 210px; margin-left:5px; }
.sideMenu li									{ float: left; clear: both; display: inline; margin: 0; }
.sideMenu li a									{ display: block; font-size: 1.1em; text-decoration: none; padding: 0px; line-height: 1; width: 210px; color: #267daf;  background: #f1f1f1 url(../layout/grupeBullet.gif) no-repeat 3px 11px;}
.sideMenu li a:visited,
.sideMenu li a:focus,
.sideMenu li a:hover							{ color:#235974;}
.sideMenu li a span								{ display: block; padding: 8px 6px 8px 14px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; 	border-bottom: 1px solid #fff; }

.sideMenu li ul 								{ width: 210px!important; padding: 0; }
.sideMenu li ul li 								{ width: 210px!important; line-height: 1.3; margin: 0; }
.sideMenu li ul li a 							{ background: #F1F1F1; font-size: 1em; margin: 0px; border-style: none; }
.sideMenu li ul li a span 						{ padding: 7px 10px 7px 14px!important; color: #267DAF; text-transform: none !important; border-bottom: 1px solid #fff; font-weight: normal; }

/******************* mali banneri **************/
#maliBanneri 									{ }
#maliBanneri img 								{ margin-bottom: 2px; }
#maliBanneri p									{ margin:0px 0px 2px!important;}
/******************* mali banneri **************/
/******************* najave edukacija **********/
#najaveEdukacija								{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede; margin-bottom: 4px;	padding-bottom: 2px; }
#najaveEdukacija h2 							{ background: url(../layout/najaveEdukacijaTitle.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 25px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }

.edukacija										{ background: #f6f6f6; margin: 0px 5px 2px; padding: 7px 7px 5px; }
.edukacija h3 									{ color: #267daf; font-size: 1.1em; font-weight: bold; }
.edukacija .date 								{ display: block; text-align: right; font-size: 0.9em; color: #4a4a4a; }

h3#polazniciSeminara							{ background: url(../layout/galerijaPolaznikaBg.gif) no-repeat; height: 38px; width: 215px; text-transform: uppercase;	color: #fff; text-align: right;	padding-top: 15px;	padding-right: 5px;	font: bold 1.3em/1.3em "Trebuchet MS", Arial, Helvetica, sans-serif;	margin-bottom: 5px; }
h3#polazniciSeminara a 							{ color: #fff; height: 53px; width: 220px; }


/******************* najave edukacija **********/
/******************* SIDE CONTENT **************/

/******************* MAIN CONTENT **************/
#mainContent									{ float:left; width:514px; display:inline; margin: 0px 4px; }

/******************* BREADCRUMBS ***************/
#breadcrumbs									{ padding: 3px; margin-bottom: 2px; background: #F6F6F6; margin-top: 12px; }
#breadcrumbs a 									{ font-size: 0.9em; }
#breadcrumbs a:hover							{ color:#CFCFCF; }
/******************* BREADCRUMBS ***************/

#velikiBanner 									{ margin: 0px; padding: 0px; }
#velikiBanner img,
#velikiBanner p 								{ margin-bottom: 4px; } 

.velikiBanner 									{ margin: 0px; padding: 0px; }
.velikiBanner img,
.velikiBanner p 								{ margin-bottom: 4px; } 

#indexContentHolder,
#contentHolder									{ background: url(../layout/contentBg.gif) repeat-y; border-bottom: 1px solid #dedede; font-size: 1.1em; }
#indexContentHolder h1,
#contentHolder h1								{ background: url(../layout/mainTitleBg.gif) no-repeat; height: 20px; text-transform: uppercase; color: #fff;	padding-top: 13px; padding-left: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.content 										{ background: #f6f6f6; margin: 5px; padding: 4px 10px 5px; }
.content p 										{ line-height:1.4; margin-bottom:1.3em;}
.content h2 									{ color: #3991BD; margin: 0px 0px 5px; font-size: 1.2em; }
.content span.titleDate 						{ font-size: 9px!important; color: #4F4C42; text-align: right; }

.content img 									{ border: 5px solid #E0E0E0; margin-top: 3px; margin-right: 8px; }

span.contentFooterLinks 						{ display: block; margin: -6px 0px 0px; padding: 0px; text-align: right; clear: both; font-size: 1.1em; }
.contentFooterLinks a 							{ margin-left: 10px; background: url(../layout/linkNext.gif) no-repeat right center; padding-right: 10px; }

span.contentFooterLinks a:hover 				{ color: #FBFAF7; background: #3991bd url(../layout/linkNextHover.gif) no-repeat right center; }

.najaveSeminaraTable							{ margin-bottom: 16px; width: 100%; border-top: 1px solid #ddd; border-left: 1px solid #ddd; }
.najaveSeminaraTable td 						{ padding: 4px 4px 4px 6px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.najaveSeminaraTable th 						{ padding: 4px 4px 4px 6px; vertical-align: top; width: 130px; text-align: left; border-right: 1px solid #ddd;	border-bottom: 1px solid #ddd;	color: #2E7698; }
/******************* galerijePolaznika *********/
.galerijePolaznika								{ margin: 0px 5px 5px; padding: 7px 10px; background: #f6f6f6 url(../layout/galerajPolaznika.gif) no-repeat right top; }
.galerijePolaznika h2 							{ color: #0066A1; padding: 0px 10px 2px 0px; margin-bottom: 3px; text-transform: uppercase;  font: bold 1.2em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.galerijePolaznika dl 							{ padding: 0px; }
.galerijePolaznika dt							{ float: left; padding: 1px 0.7em 1px 0px; }
.galerijePolaznika dd 							{ margin-right: 0; margin-bottom: 0.3em; margin-left: 0; padding: 1px 2px 1px 0px; }

/******************* galerijePolaznika *********/
/******************* documents******************/
.documentsHolder								{ margin: 0px 5px 5px; padding: 7px 10px; background: #f6f6f6 url(../layout/documentsIcon.gif) no-repeat right top; }
.documentsHolder h2 							{ color: #0066A1; padding: 0px 10px 2px 0px; margin-bottom: 3px; text-transform: uppercase;  font: bold 1.2em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.documentsHolder dl 							{ padding: 0px; }
.documentsHolder dt								{ float: left; padding: 1px 0.7em 1px 0px; }
.documentsHolder dd 							{ margin-right: 0; margin-bottom: 0.3em; margin-left: 0; padding: 1px 2px 1px 0px; }

/******************* documents******************/
/******************* gallery *******************/
.galleryWrapper									{ margin: 0px 5px 5px; padding: 7px 9px; background: #f6f6f6; }
.galleryHolder									{ margin-bottom: 5px; }
.galleryHolder img 								{ vertical-align: top; margin-right: 11px; margin-left: 11px; border: 5px solid #E0E0E0; }
/******************* gallery *******************/

/******************* obrazac *******************/
#mainForma fieldset		 						{ margin: 0px 0px 6px; padding: 1px 10px 5px; }
#mainForma 										{ margin: 1px 0px 0px; padding: 5px 0px 8px; }
#mainForma p 									{ padding-right: 10px; padding-left: 10px; }
#mainForma label 								{ text-align: right; width: 150px; display: block; float: left; margin: 3px 0; padding: 2px 5px 2px 0; }
#mainForma label.radioRow								{ text-align: right; width: 400px; display: block; float: none !important; margin: 3px 0; padding: 2px 5px 2px 0; }
#mainForma br 									{ clear:left;}

#mainForma .noteRight		 						{ text-align:right; font-size: 0.92em; width: 405px;margin-bottom:10px }
#mainForma .noteLeft		 						{ text-align:left; font-size: 0.92em; width: 405px;margin-bottom:10px }

#mainForma .upit-buttons 						{ clear: both; height: auto !important; margin: 15px auto; text-align:center}
#mainForma img 									{ padding:0px; margin:0px;}

#mainForma .upit-input,
#mainForma textarea,
#mainForma .upit-select						{ padding: 4px 2px; border: 1px solid #D7D7D7; font-weight: normal; text-transform: none; color: #333; width: 250px; margin-bottom: 3px; font-size: 1em; background: #fff; }
#mainForma textarea							{max-width: 250px; min-width: 250px; height: 150px; min-height: 150px; }
.brojevi-input 									{ padding: 4px 2px; border: 1px solid #d7d7d7; font-weight: normal; text-transform: none; color: #333; width: 90px; margin-bottom: 3px; font-size: 1em; background: #fff; }
.brojevi-input:focus,
#mainForma textarea:focus,
#mainForma .upit-input:focus	 				{ background: #fff; border: 1px solid #3991bd; }
#mainForma .submitRegistration				{ border: solid 1px #0066A1; background-color: #3991BD; color: #FFF; font-weight: bold; padding: 3px}
#mainForma .upit-select						{ padding: 4px 2px; border: 1px solid #D7D7D7; font-weight: normal; text-transform: none; color: #333; width: 256px; margin-bottom: 3px; font-size: 1em; background: #fff; }

/******************* obrazac *******************/

/******************* pagination ****************/
#page 											{ padding: 4px 0px 0px; text-align: center; color: #585858; margin: 5px 0px 0px;	width: 514px; }
p.pager 										{ line-height: 1.5em; margin-bottom: 8px; }
.pager a, 
.pager a:visited, 
.pager a:active 								{ color: #585858; padding: 2px 6px; border: 1px solid #d3d3d3; background: #fff url(none); outline: none; text-decoration: none; margin: 0px 2px; }
.pager span.break 								{ padding: 2px 6px; color: #585858; }

.pager a:hover									{ border: 1px solid #3991BD; background: #fff url(none); color: #3991BD; }
.pager span.active 								{ border: 1px solid #3991BD; background: #fff url(none); color: #585858!important; padding: 2px 6px; color: #968f80; margin: 0px 2px; }

.pager span.countLinks a						{ color:#3991BD!important; background: #fff!important; border-style: none!important; padding: 0px 5px!important; }
.pager span.no-page								{ color:#a7a7a7!important; padding: 0px 5px!important; }
/******************* pagination ****************/

/******************* MAIN CONTENT **************/

/******************* SECOND CONTENT ************/
#secondContent									{ float:left; width:220px; display:inline; }
#newsHolder 									{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede;	padding-bottom: 2px; }
#newsHolder h2 									{ background: url(../layout/novostiTitleBg.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 26px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
#newsHolder .archiveLnk 						{ text-align: center; display: block; padding: 4px 0px;	background: url(../layout/archiveLnk.gif) repeat-x;	margin: 0px 3px; }
#newsHolder .archiveLnk a 						{ text-transform: uppercase; color: #fff; font-weight: bold; padding: 3px 6px; }


.novost 										{ padding: 7px 7px 5px; background: #f6f6f6; margin: 0px 4px 2px; }
.novost h3 										{ font-size: 1.2em; color: #267daf; }
.novost a:hover 								{ border-bottom: 1px solid #DFDFDF; padding-bottom: 1px; }

.novost .date 									{ font-size: 0.9em; color: #267DAF; display: block; text-align: right; }


#documentsList									{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede;	padding-bottom: 2px; }
#documentsList h2								{ background: url(../layout/dokumentiTitleBg.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 26px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.welcome										{ background: url(../layout/smallBoxBg.gif) repeat-y; border-bottom: 1px solid #dedede;	padding-bottom: 2px; }
.welcome h2										{ background: url(../layout/simpleTitleBg.gif) no-repeat; height: 20px; width: 215px; text-transform: uppercase; color: #fff; padding-top: 26px; margin-bottom: 4px; text-align: right; padding-right: 5px; font: bold 1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; }
.welcomeCenter									{ margin:5px; padding:8px; background:#f6f6f6;}
.welcomeCenter a								{ font-size:1.2em; margin-top:10px; display:block; margin-top:10px; text-align:right;}
/******************* SECOND CONTENT ************/

/******************* FOOTER ********************/
#footer											{ clear: both; color: #fff; font-size: 1.1em; }
#footerContent									{ width:970px; margin: 0px auto; background: url(../layout/footerContentBg.gif) repeat-x; height: 24px;	padding-top: 29px; }
#footer p.copyright								{ display: inline; float: left; margin-left: 5px; }
#footer p.izrada								{ display: inline; float: right; margin-right: 5px; }
/******************* FOOTER ********************/