/*
                                                 
-> Project: Zajedno protiv raka.                               
-> Author: Igor Gotal-Luksa / Dobbin				 
-> Copyright (c) 2010: Dobbin / www.dobbin.hr
                   							                         
*/


/* CLEARING METHODS
----------------------------------------------------------------------------*/

	.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%; 
		}
	
	.clear {
		clear: both; 
		}
		
		
/* RESET & NORMALIZE
----------------------------------------------------------------------------*/

	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, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		}

	:focus {
		outline: 0;
		}

	ol, ul {
		list-style: none;
		}
		
	a {
		outline: none;
		}
		
	.hidden {
		display: none;
		}
		
		
/* HTML & BODY
----------------------------------------------------------------------------*/

	body {
		font: 62.5%/1.8 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		background: #d7dcde url("../images/background.jpg") top left repeat-x;
		text-align: center;
		padding: 20px 0 20px 0;
		color: #6f6f6f;
		}
		
/* CONTAINER
----------------------------------------------------------------------------*/

	#container {
		width: 960px;
		margin: 0px auto;
		text-align: left;
		}
		
		
/* HEADER
----------------------------------------------------------------------------*/

	#header {
		width: 960px;
		height: 230px;
		background: #000 url("../images/header_background.jpg") top left no-repeat;
		}
		
		
/* BRANDING
----------------------------------------------------------------------------*/

	#branding {
		float: left;
		width: 620px;
		}

	#branding h1 {
		text-indent: -9999px;
		}
		
	#branding p {
		font: normal 1.3em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-shadow: 0px 1px 0px #fff;
		width: 450px;
		position: relative;
		left: 150px;
		top: 85px;
		}
		
/* MAIN NAVIGATION
----------------------------------------------------------------------------*/

	#main-navigation {
		width: 310px;
		float: right;
		}
		
	#main-navigation ul {
		margin-top: 29px;
		}
		
	#main-navigation ul li {
		font: normal 1.55em/1.9 Arial, Verdana, Helvetica, sans-serif;
		text-transform: uppercase;
		margin-bottom: 5px;
		}
		
	#main-navigation ul li.naslovnica a {
		padding-right: 10px;
		background-color: #d40050;
		color: #fff;
		display: block;
		width: 200px;
		text-decoration: none;
		text-align: right;
		height: 30px;
		}
		
	#main-navigation ul li.naslovnica:hover a {
		background-color: #ea0058;
		}
		
	#main-navigation ul li.onama a {
		padding-right: 10px;
		background-color: #ed8026;
		color: #fff;
		display: block;
		width: 260px;
		text-decoration: none;
		text-align: right;
		height: 30px;
		}
		
	#main-navigation ul li.onama:hover a {
		background-color: #ef8d3d;
		}

	#main-navigation ul li.rak a {
		padding-right: 10px;
		background-color: #eda726;
		color: #fff;
		display: block;
		width: 240px;
		text-decoration: none;
		text-align: right;
		height: 30px;
		}
		
	#main-navigation ul li.rak:hover a {
		background-color: #f0b546;
		}
		
	#main-navigation ul li.clanice a {
		padding-right: 10px;
		background-color: #becb48;
		color: #fff;
		display: block;
		width: 290px;
		text-decoration: none;
		text-align: right;
		height: 30px;
		}
		
	#main-navigation ul li.clanice:hover a {
		background-color: #c4cf58;
		}
		
	#main-navigation ul li.novosti a {
		padding-right: 10px;
		background-color: #64afaf;
		color: #fff;
		display: block;
		width: 205px;
		text-decoration: none;
		text-align: right;
		height: 30px;
		}
		
	#main-navigation ul li.novosti:hover a {
		background-color: #78baba;
		}
		
	
/* CONTENT
----------------------------------------------------------------------------*/

	#content {
		background: #f9f9fa url("../images/content_background.gif") repeat-y top left;
		}
		
	#content-left {
		background: transparent url("../images/content_left_background.gif") no-repeat top left;
		width: 650px;
		float: left;
		padding: 30px 0 30px 0;
		}
		
	#content-right {
		background: transparent url("../images/content_right_background.gif") no-repeat top left;
		width: 310px;
		float: right;
		padding: 190px 0 30px 0;
		}
		
/* CONTENT LEFT
----------------------------------------------------------------------------*/

	#content-left h2.content {
		font: normal 2.8em/1.2 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-shadow: 0px 1px 0px #fff;
		padding-bottom: 10px;
		width: 590px;
		border-bottom: 1px solid #e2e4e5;
		margin: 0 0 20px 30px;
		}
		
	#content-left h3.content {
		font: bold 1.6em/1.2 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		max-width: 590px;
		margin: 0 0 20px 30px;
		}

	#content-left p {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		margin-bottom: 10px;
		max-width: 590px;
		margin: 0 0 10px 30px;
		color: #6f6f6f;
		}
		
	#content-left ul.content {
		margin: 0 0 10px 65px !important;
		list-style-type: square !important;
		}
		
	#content-left ul.content li {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif !important !important;
		max-width: 560px !imortant;
		padding: 2px 0 2px 0 !important;
		}
		
	#content-left ul {
		margin: 0 0 10px 65px;
		list-style-type: square;
		}
		
	#content-left ul li {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif !important;
		max-width: 560px;
		padding: 2px 0 2px 0;
		}
		
	#content-left p a, #content-left ul li a {
		color: #ed8026;
		}
		
	#content-left p a:hover, #content-left ul li a:hover {
		text-decoration: none;
		color: #ed8026;
		}

	.article-item {
		margin: 0 0 20px 30px;
		padding-bottom: 10px;
		border-bottom: 1px solid #e2e4e5;
		width: 590px;
		}
		
	.article-item h2 {
		font: normal 2em/1.1 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		margin: 0 0 5px 0 !important;
		}
		
	.article-item h2 a {
		text-decoration: none;
		color: #474747;
		}
		
	.article-item h2 a:hover {
		text-decoration: underline;
		}
		
	.article-item h3 {
		font: normal 1.2em/1.4 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		margin: 0 0 10px 0 !important;
		color: #474747;
		}
		
	.article-item h3 span {
		color: #ed8026;
		}
		
	.article-item p {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		margin: 0 !important;
		}
		
	.article-item p img, .article-details p img, p img {
		float: left;
		margin: 5px 15px 15px 0;
		border: 1px solid #d9dddf;
		}

	.article-item p a {
		color: #ed8026;
		}
		
	.paging {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-align: right;
		margin-right: 30px;
		}
		
	.paging a {
		padding: 0 5px 0 5px ;
		color: #ed8026;
		}
		
/* CONTENT RIGHT
----------------------------------------------------------------------------*/

	#content-right h3 {
		font: normal 1.55em/1.95 Arial, Verdana, Helvetica, sans-serif;
		text-transform: uppercase;
		background-color: #ed8026;
		color: #fff;
		width: 265px;
		display: block;
		position: relative;
		left: 30px;
		margin-bottom: 15px;
		padding-left: 15px
		}
		
	#content-right h4 {
		font: bold 1.4em/1.2 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #6f6f6f;
		position: relative;
		left: 30px;
		margin-bottom: 5px;
		max-width: 260px
		}
		
	#content-right h4 a {
		text-decoration: none;
		color: #6f6f6f;
		}
		
	#content-right h4 a:hover {
		text-decoration: underline;
		}
		
	#content-right p {
		font: normal 1.2em/1.6 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #6f6f6f;
		position: relative;
		left: 30px;
		margin-bottom: 15px;
		max-width: 260px;
		}
		
	#content-right p.news {
		font: normal 1.2em/1.4 "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		color: #6f6f6f;
		position: relative;
		left: 30px;
		margin-bottom: 10px;
		padding-bottom: 10px;
		max-width: 260px;
		border-bottom: 1px solid #eaebec;
		}
		
	#content-right p span, #content-right p a {
		color: #ed8026;
		}
		
	#content-right p.signature {
		font: italic 1.6em/1.4 Georgia, "Times New Roman", Times, serif;
		color: #ed8026;
		position: relative;
		left: 30px;
		margin-bottom: 15px;
		max-width: 260px;
		}
		
	#logos {
		margin-left: 30px;
		}
		
	#logos img {
		margin: 0 15px 5px 0;
		padding: 3px;
		background-color: #f7f8f9;
		border: 1px solid #dde1e3;
		}

		
/* FOOTER
----------------------------------------------------------------------------*/

	#footer {
		background-color: #62696c;
		height: 50px;
		}

	#footer ul {
		margin-left: 20px;
		}
		
	#footer ul li {
		font: normal 1.4em/145% Arial, Verdana, Tahoma, Helvetica, sans-serif;
		float: left;
		width: auto;
		padding: 0 20px 0 0;
		}
		
	#footer ul li a:hover {
		text-decoration: none;
		}
		
	#footer #copyright {
		float: left;
		width: auto;
		}
		
	#footer #bottom-navigation {
		float: right;
		width: auto;
		}

	 #footer #copyright {
		font: normal 1.1em/145% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		color: #d7dcde;
		position: relative;
		left: 30px;
		top: 17px;
		}
		
	#footer #copyright a {
		color: #fff;
		text-decoration: none;
		}
		
	#footer #copyright a:hover {
		text-decoration: underline;
		}
		
	#footer #bottom-navigation {
		margin: 0px;
		}
		
	#footer #bottom-navigation {
		position: relative;
		left: -20px;
		top: 17px;
		}
		
	#footer #bottom-navigation ul li {
		font: normal 1.1em/145% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
		border-left: 1px solid #787e80;
		padding: 0 15px 0 15px;
		}
		
	#footer #bottom-navigation ul li a {
		color: #d7dcde;
		text-decoration: none;
		}
		
	#footer #bottom-navigation ul li a:hover {
		color: #fff;
		text-decoration: underline;
		}
		
	#croadria {
		margin-top: 20px;
		position: relative;
		left: 370px;
		}