/* 



	project: internet services - 2nd edition

	author: luka cvrk (www.solucija.com) */



   

/* default styles

   -------------- */

*{ margin: 0; padding: 0; }* 

body {
	background: #fff;
	color: #444;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.7em;
	line-height: 1.6em;
}

a {	color: #E0691A;	background: inherit;}

a:hover { color: #6C757A; background: inherit; }



h1, #emptyData { font: normal 2.4em "Trebuchet MS", Arial, Sans-Serif; padding: 7px 0 0 8px; margin: 0; }

h1 a { color: #737373; background: inherit; }

.orange { color: #E0692A; }

sup { font-size: .5em; }



h1 a, h2 a { text-decoration: none; }

h1 a:hover, h2 a:hover { color: #FF6600; background: inherit; }

h2 { font-size: 1.5em; margin-bottom: 5px; color: #000; background: inherit; }

p {	margin: 0 0 5px 0; }



ul { list-style : none; }



/* layout

   ------ */



.content { 

	margin: 0 auto;

	width: 980px;

	padding: 10px; 

}



.header { 

	height: 70px;

	background: #fff url(images/headerbg.gif) repeat-x bottom;

	color: #808080;

	margin: 3px 0;

	padding: 10px 0 0 0;

}



.top_info {
	float: right;
	width: 555px;
	padding: 5px 0 4px 0;
	color: #808080;
	text-align: center;

}



	.top_info_left {

		width: 200px;

		float: left;

	}



	.top_info_right {

		float: right;

		width: 290px;

		padding: 0 0 0 35px;

		border-left: 1px solid #eee;

	}



.browse_category  {

	width: 390px;

	color: #FFF;

	background: inherit;

}



.bar { 

	clear: both;

	font-size: 1.1em;

	height: 30px; 

	color: #FFF;

	background: #FF9148 url(images/menubg.gif) repeat-x;

}



	.bar li { 

		padding: 6px 12px 6px 12px;

		color: #FFEADC;

		float: left; 

	}

	

	.bar li.active { 

		background: #E0691A url(images/bar.gif) repeat-x; 

		color: #fff;

		font-weight: bold; 

		

	}

	

	.bar li a { 

		font-weight: bold;

		color: #FFF; 

		background: inherit;

		text-decoration: none;

	} 

	

/* search form */

.search_field { 

	background: #fff url(images/searchbg.gif) no-repeat right; 

	color: #808080;

	clear: both;

	font-weight: bold;

	padding: 7px 12px 10px 10px;

	margin: 5px 0;

}

	input.search { 

		width: 292px; 

		border: 0;

		background: #FFF url(images/input.gif) no-repeat;

		padding: 4px; 

		color: #E0691A;

		font-weight: bold;

		margin: 0 0 0 3px;

	}

	input.submit {

		background: #E0691A url(images/submit.gif) no-repeat;

		border: 0;

		padding: 4px 0;

		width: 65px;

		margin: 0 10px 1px 0;

		color: #FFF;

		font: bold 1em Arial, Sans-Serif;

	}

	.grey { color: #808080; background: inherit; font-weight: normal; }

	.search_form { float: right; }



/* left side

   --------- */



.left {

	float: left;

	width: 634px;

	margin: 0 0 10px 0;

}



.left h2 {

	clear: both;

	background: #E8E8E8 url(images/h2bg.gif) no-repeat center left;

	color: #444;

	padding: 1px 0 3px 43px;

	font: bold 1.4em "Trebuchet MS", Arial, Sans-Serif;

	margin: 0 0 10px 0;

}

.left h3 {
	color: #444;
	padding: 3px 0 4px 25px;
	font: bold 1.4em "Trebuchet MS", Arial, Sans-Serif;
	margin: 0 0 10px;
	background-image: url(images/cog.png);
	background-repeat: no-repeat;
	background-position: left center;
	text-transform: uppercase;

}
	.left_side {

		float: left;

		width: 40%;

		padding: 0 0 0 10px;

		margin: 10px 0 0 10px;

	}

		

	.left_side a, .right_side a { color: #414141; background: #FFF; }

		

	.right_side {

		float: right;

		width: 280px;

		background: #FFF url(images/dotted.gif) repeat-y;

		color: #414141;

		padding: 0 0 0 70px;

		margin: 10px 0;

	}

	.left_box { 

		margin: 0 0 10px 0; 

		color: #000; 

		background: #FFF; 

		padding: 3px 0; 

	}

	

		

/* right side

   ---------- */

		

.right {

	float: right;

	width: 340px;

	margin: 0 0 10px 0;

}

	.right h3 {
	background: #BDBDBD  url(images/h3bg.gif) no-repeat center right;
	color: #000000;
	padding: 5px 0 6px 5px;
	margin: 0 0 3px 0;
	font-family: Tahoma, Arial, Sans-Serif;
	font-size: 1em;
	font-weight: bold;
	}

	.right_articles {

		background: #f5f5f5;

		color: #414141;

		padding: 8px;	

		margin: 0 0 3px 0;

	}

	.notice {

		background: #eee;

		color: #808080;

		padding: 12px 8px;	

		margin: 0 0 3px 0;

	}

	.image,.thumbnail {

		float: left;

		margin: 0 9px 3px 0;

	}

	

	.thumbnail {

	border: 0px;

		

	}



/* footer

   ------ */



.footer { 

	clear: both;

	text-align: center;

	padding: 10px 0;

	border-top: 1px solid #ccc;

	line-height: 2em;

}

	.footer a { color: #808080; background: #fff; }



.bannerright {

	margin: 5px;

	padding: 0px;

	float: right;

	width: 196px;

	border: 1px solid #999999;

}

div#paging {

	margin: 0px;

	padding: 0px;

	clear: both;

}

div#paging label#left {

	font-family: Arial, Helvetica, sans-serif;

	font-size: 11px;

	color: #000000;

	float: left;

	width: 40%;

	margin-top: 0px;

	margin-right: 0px;

	margin-bottom: 10px;

	margin-left: 0px;

}

div#paging label#left input {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 11px;

	color: #000000;

	text-decoration: none;

	border: 1px solid #000000;

}



div#paging label#right {

	float: right;

	font-family: Arial, Helvetica, sans-serif;

	font-size: 11px;

	color: #000000;

	width: 40%;

	text-align: right;

}

#documentation {

	margin: 0px;

	padding: 0px;

	float: right;

	width: 99%;

}

#documentation img {

	padding: 0px;

	float: right;

	margin-top: 0px;

	margin-right: 5px;

	margin-bottom: 0px;

	margin-left: 0px;

}

#container1 {

	padding: 0px;

	float: left;

	width: 100%;

	margin: 0px;

}

.tabs {

position:relative; 

height: 20px; margin: 0; 

padding: 0; 

overflow: hidden;

}

.tabs li {

display:inline;

}

.tabs a {

height: 16px; 

background: #c2ceda; 

position:relative; 

padding: 8px;

font-size : 11px; 

font-weight : bold; 

color : #fff; 

font-family : Verdana, arial, helvetica, sans-serif; 

text-decoration : none; 

}

.tabs a.tab-visited {

background-color:#6898d0; 

border-right: 1px solid #fff;

font-size : 11px; 

font-weight : bold; 

color : #fff; 

font-family : Verdana, arial, helvetica, sans-serif; 

text-decoration : none; 

}

.tabs a:hover {

background-color:#80A0C6; 

font-size : 11px; 

font-weight : bold; 

color : #fff; 

font-family : Verdana, arial, helvetica, sans-serif; 

text-decoration : none; 

}  

.tabs a.tab-active {

background-color:#6898d0; 

border-right: 1px solid #fff;

font-size : 11px; 

font-weight : bold; 

color : #fff; 

font-family : Verdana, arial, helvetica, sans-serif; 

text-decoration : none; 

}

.tab-panes { 

width: 98%;

margin: 0px;

} 

.divtabs {

padding: 6px;

background-color: #fff;

border: 1px solid #B9CFE1; 

font-size : 12px; 

font-weight : normal; 

color : #2a2a2a; 

font-family : Verdana, arial, helvetica, sans-serif; 

text-decoration : none; 

}



/************************************************/



#lightbox{

	position: absolute;

	top: 40px;

	left: 0;

	width: 100%;

	z-index: 100;

	text-align: center;

	line-height: 0;

	}



#lightbox a img{ border: none; }



#outerImageContainer{

	position: relative;

	background-color: #fff;

	width: 250px;

	height: 250px;

	margin: 0 auto;

	}



#imageContainer{

	padding: 10px;

	}



#loading{

	position: absolute;

	top: 40%;

	left: 0%;

	height: 25%;

	width: 100%;

	text-align: center;

	line-height: 0;

	}

#hoverNav{

	position: absolute;

	top: 0;

	left: 0;

	height: 100%;

	width: 100%;

	z-index: 10;

	}

#imageContainer>#hoverNav{ left: 0;}

#hoverNav a{ outline: none;}



#prevLink, #nextLink{

	width: 49%;

	height: 100%;

	background: transparent url(images/blank.gif) no-repeat; /* Trick IE into showing hover */

	display: block;

	}

#prevLink { left: 0; float: left;}

#nextLink { right: 0; float: right;}

#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }

#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }





#imageDataContainer{

	font: 10px Verdana, Helvetica, sans-serif;

	background-color: #fff;

	margin: 0 auto;

	line-height: 1.4em;

	}



#imageData{

	padding:0 10px;

	}

#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	

#imageData #caption{ font-weight: bold;	}

#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			

#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	

		

#overlay{

	position: absolute;

	top: 0;

	left: 0;

	z-index: 90;

	width: 100%;

	height: 500px;

	background-color: #000;

	filter:alpha(opacity=60);

	-moz-opacity: 0.6;

	opacity: 0.6;

	}

	



.clearfix:after {

	content: "."; 

	display: block; 

	height: 0; 

	clear: both; 

	visibility: hidden;

	}



* html>body .clearfix {

	display: inline-block; 

	width: 100%;

	}



* html .clearfix {

	/* Hides from IE-mac \*/

	height: 1%;

	/* End hide from IE-mac */

	}	

.pollingbar {

	background-image: url(images/bar1.gif);

	background-repeat: no-repeat;

	background-position: left;

	margin: 0px 0px 0px 20px;

	padding: 0px;

	height: 7px;

}

#dropcontentsubject{

	font-weight: bold;

	color: #000000;

	text-decoration: none;

}



.imgthumb {

	background-image: url(images/collapsed_bottom.gif);

	background-repeat: no-repeat;

	background-position: left top;

	margin-right: 4px;

	margin-left: 4px;

	padding: 8px 10px 10px 7px;

	float: left;

}

.imgthumb img {

	border:0px;

}
#video {
display:block;float:left; margin:0px 20px 10px 10px;
}
#video * {
	float:left;
}