* {
	font-family: Arial, sans-serif; 
	padding: 0px; 
	margin: 0px; 
	border: 0px;
	text-decoration: none;
}

body {
	background-color: #9D8D85; 
	padding: 0px; 
	margin: 0px; 
}

/* PAGE LAYOUT */
/* DIVS that place everything on page in 3 column design */

#container { /* big container for 4 divs (hdr, left, right, main) */

	margin-left:auto;
	margin-right:auto;
	width: 1000px;
	background: #9D8D85;
	/*overflow: hidden; /* Stops background becomming invisible in Firefox */
}

#hdr { /* header, also contains image gallery */
	
	width: 1000px;
	height: auto; /* fixes a weird IE gallery offset-bug, but introduces some new problems in Firefox/Opera */
	background: #9D8D85;
}

#spacer { /* div in header, for placing the gallery div correctly */
	
	width: 264px;
	padding-top:130px;
	padding-right:50px; /* correct width if necesary... must be 329px together */
	float: left;
	text-align: right;
	font-size: 1em;
	color:#B3A59F;
	font-weight: bolder;
}

#spacer a:link, a:visited {
	font-weight: bolder;
	display: inline;
	color: #B3A59F;
	padding: 0px;
	margin: 0px;
}

#spacer a:hover, a:active {
	color: #FDC689;
	padding: 0px;
	margin: 0px;
}

#gallery {
	padding-top:20px; /* a very weird Firefox/Opera bug unless this is 20px */
	padding-bottom: 15px;
	text-align: left;
	width: 686px; /* if hdr height: auto; then this helps to display the page properly in Firefox/Opera*/
	float: left;
}

#left { /* left navbar div */
	
	float: left;
	width: 329px;
	height: 384px;
	background: url('images/bg_left.gif') no-repeat;
}

#left img {
	float: left;
}

#right img {
	float: right;
	margin-top: 180px;
}
#right { /* left navbar div */
	
	float: right;
	width: 329px;
	height: 384px;
	background: url('images/bg_right.gif') no-repeat bottom left #000;
}

#main { /* main textarea div */
	overflow: hidden;	
	float: left;
	width: 342px;
	height: 384px;
	background: #C4B8B2;
	
}

#mainnavigation {

	text-align: left;
	width: 322px;
	background: #C4B8B2;
}

#mainnovice {
	background: #CCCAC0;
	width: 100%;
	height: 130px;
	overflow: hidden;
	border: 0px solid black;
	margin-left:auto;
	margin-right:auto;
}

#bottom { /* This div is used for validation and copyright info */

	width: 990px;
	height: 20px;
	color: #333;
	font-size: 0.6em;
	text-align: left;
	font-weight: bolder;
	
	float: left;
	padding-bottom: 20px;
}

#bottom_spacer {
	float: left;
	margin-left:auto;
	margin-right:auto;
	width: 990px;
	height: 20px;
}

table.maintext {
   color:#820024;
	table-layout: auto;
	width: 100%;
	border: 0px;
	font-size: 8pt;
}

#form {
	
	margin-left: auto;
	margin-right: auto;
	font-size: 0.6em;
	color: #820024;
}



/* page scrolling */
	#scroll_up {
    cursor: pointer;
  }
  #scroll_down {
    cursor: pointer;
  }
  #scroll_box {
  	text-align: left;
  	margin: auto;
  	/*height: 240px;*/
	height: 250px;
	/*padding-bottom: 20px;*/
    width: 100%;/*322px;*/
  }
  
  /* TEXT & LIST styles */
  
  #gallery a	{
  	display: block;
  	float: left;
		border: 0px;
		margin: 0px;
		padding: 0px;
	}
	
	#gallery img	{
  	display: block;
  	float: left;
		border: 0px;
		margin: 0px;
		padding: 0px;
	}

#main h1, #main h2 {  /* Styles for headings in the main content area */

	margin-top: 5px;
	margin-left: 10px;
	margin-bottom: 20px;
	font-family: Arial, sans-serif; /* Makes the headings a different font to the paragraph text */	
	font-weight: bolder;
	font-size: 0.9em;
	color: #820024;
	line-height: 1.0em;
	letter-spacing: 0px;
/*	text-decoration: underline; */
}

#main h2 { /* Makes h2 slightly smaller than h1 */
	font-size: 0.75em;
	line-height: 0.75em;
}

#main p {   /* styles main area paragraph text */
	
	margin-left: 1em;
	margin-right: 1.5em;
	margin-bottom: 1em;
	font-size: 0.7em;
	color: #820024;
	text-align: justify;
}

#vodilo {
	font-weight: bolder;
	font-style: italic;
	margin-left: 1em;
	margin-right: 1.5em;
	margin-bottom: 1em;
	font-size: 0.7em;
	color: #820024;
	text-align: justify;
	line-height: normal;
}

#vodilo_novice {
	font-style: italic;
	margin-left: 1em;
	margin-right: 1.5em;
	margin-bottom: 1em;
	font-size: 0.7em;
	color: #820024;
	text-align: justify;
}


#mainnovice h1{
	color: #820024;
	font-size: 0.7em;
	margin-top: 1.5em;
	margin-bottom: 1em;
	padding-right: 2em;
	font-weight: bolder;
	text-decoration: none;
}
#mainnovice h2{
	color: #820024;
	font-size: 0.7em;
	font-style: italic;
	padding-right: 2em;
	text-decoration: none;
}

#mainnovice p {
	color: #820024;
	font-size: 0.7em;
	margin-top: 10px;
	margin-bottom: 10px;
	text-decoration: none;
}

#main ul {   /* styles main area unordered(bulleted) lists */

	margin-top: 15px; /* This margin is the top margin of the WHOLE list, hence why it is specified in ul and not li */
	margin-bottom: 15px; /* This margin is the bottom margin of the WHOLE list, hence why it is specified in ul and not li */
	font-size: 0.7em;
	color: #820024;
	line-height: 1.5em;
	list-style: square; /* This controls the bullet point style. */
}

#main li {

  margin-left: 50px; /* This margin acts as an indent for each list item.  Indenting the whole list doesn't work well in IE. */
	text-align: left;
}

  #mainnavigation h1 { /* Styles for main navigation links */

	  margin-top: 20px;
	  margin-left: 20px;
	  margin-bottom: 0px;
	  font-family: Arial, sans-serif; /* Makes the headings a different font to the paragraph text */
	  font-size: 1.0em;
	  font-weight: bolder;
	  color: #44260C;
	  line-height: 1.0em;
          letter-spacing: 0px;
          text-decoration: none;
}

#mainnavigation ul {

	margin-left: -30px; /* you have to substract margin from #main li margin for amount that is over 50px */
	margin-top: 0px;
	margin-bottom: 12px;
	list-style-type: none;
	list-style: none;
}

#mainnavigation li {

	padding-left: 0px;
	border: 1px solid #C4B8B2; /* this fixes a very weird IE problem */
}

#mainnavigation li#selected {
	
	color: #FDC689;
	background: #9D8D85;
}

/* LINKS */

#main a:link, #main a:visited {
	font-weight: bolder;
	display: inline;
	color: #44260C;
	padding: 0px;
}

#main a:hover, #main a:active {
	color: #FDC689;
	padding: 0px;
}

#mainnovice a:hover, #main a:active {
	color: #9D8D85;
	padding: 0px;
}

#mainnavigation li a:link, #mainnavigation a:visited {  /* These styles are for links in the main content area only */

	display: block;
	color: #44260C;
	padding-left: 30px;
	padding-right: 0px;
	
}

#mainnavigation li a:hover, #mainnavigation a:active {  /* These styles are for links in the main content area only */

	color: #FDC689;
	background: #9D8D85;
	padding-left: 30px;
	padding-right: 0px;
}

#mainnavigation a#selected {
	
	color: #FDC689;
	background: #9D8D85;
	padding-left: 30px;
	padding-right: 0px;
}

#bottom a:link, #bottom a:visited {
	font-weight: bolder;
	padding-right: 0px;
	color: #44260C;
	text-decoration: none;
}

#bottom a:hover, #bottom a:active {
	padding-right: 0px;
	color: #FFFFFF;
	text-decoration: none
}

#bottom a#currentlanguage {
	padding-right: 0px;
	color: #FFFFFF;
	text-decoration: none
}
#medijski {
 	margin-left: 187px;
	margin-right: 3px;
	font-size: 1em;
	color: #820024;
}

#bottom a.med, #bottom a.med:visited {
	color: #44260C;
}




/*NAVIGATION*/
/*LEFT*/
#left ul {   /* defined as left because the nav is in the left div */

	margin-top: 40px;  /* top margin brings the menu down slightly */
	margin-left: 0px;
	width: 224px;
	float: left;
	list-style-type: none;
}

#left li {

	text-align: right;
	padding-top: 13px;
	padding-bottom: 12px;
	margin-right:4px;
}

#left li a {  /* these "a" styles define the main text that appears when the main links are hovered over */
	color: #FFFFFF;
	text-align: right;
	text-decoration: none;
	padding: 0px;
	margin: 0px;
	font-family: Arial, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	font-weight: bolder;
	background: url('images/square.gif') no-repeat;
	background-position: 100%  55%;
	padding-right: 50px;
}

#left li a:link, #left a:visited { /* these "a" styles define the main text that appears when the main links are hovered over */
	
	color: #FFFFFF;
}

#left li a:hover, #left a:active { /* these "a" styles define the main text that appears when the main links are hovered over */

	color: #FDC689;
	background: url('images/square2.gif') no-repeat;
	background-position: 100%  55%;
}

#left  a#current {
	
	color: #FDC689;
	background: url('images/square2.gif') no-repeat;
	background-position: 100%  55%;
}

/*RIGHT*/
#right ul {   /* defined as left because the nav is in the left div */

	margin-top: 40px;  /* top margin brings the menu down slightly */
	margin-left: -0px;
	width: 224px;
	list-style-type: none;
	list-style: none;
	padding: 0px;

}

#right li {

	text-align: left;
	padding-top: 13px;
	padding-bottom: 12px;
	padding-left: 0px;
	margin-left:2px;
}

#right li a {  /* these "a" styles define the main text that appears when the main links are hovered over */

	color: #FFFFFF;
	text-align: left;
	text-decoration: none;
	padding: 0px;
	margin-left: 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	font-weight: bolder;
	background: url('images/square.gif') no-repeat;
	background-position: 0%  55%;
	padding-left: 50px;
}

#right li a:link, #right a:visited { /* these "a" styles define the main text that appears when the main links are hovered over */

	color: #FFFFFF;
}

#right li a:hover, #right a:active { /* these "a" styles define the main text that appears when the main links are hovered over */

	color: #FDC689;
	background: url('images/square2.gif') no-repeat;
	background-position: 0%  55%;
}

#right  a#current {
	
	color: #FDC689;
	background: url('images/square2.gif') no-repeat;
	background-position: 0%  55%;
}