/* CSS Document */

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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

@font-face {
 font-family: NK235;
 src: url(/fonts/NK235.otf) format("opentype");
}

@font-face {
 font-family: Jagodina;
 src: url(/fonts/JAGODINA.otf) format("opentype");
}


body {
	background:black url(images/back1.jpg) no-repeat top center fixed;
	font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#FFF;
}

ul {
	list-style:none;
}

a {
	color:#FFF;
	text-decoration:none;
}

a:hover {
	color:#C90;
}


#sve {
	width:1000px;
}

.round {
	-moz-border-radius-topright:6px;
	-moz-border-radius-topleft:6px;
 	-moz-border-radius-bottomright:6px;
	-moz-border-radius-bottomleft:6px;
  	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
  	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
}

.transparent {
		/* Fallback for web browsers that doesn't support RGBa */
		background: rgb(0, 0, 0) transparent;
		/* RGBa with 0.6 opacity */
		background: rgba(0, 0, 0, 0.3);
		/* For IE 5.5 - 7*/
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
		/* For IE 8*/
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

h1 {
	font-size:22px;
	margin-bottom:15px;
}



/* ZAGLAVLJE */
#header {
	width:900px;
	padding:0 50px;
	height:315px;
	margin:0 auto;
	background:url(images/wrap/wrapback_01.png) no-repeat;
}

#split {
	height:250px;
	width:950px;
}

#menuwrap {
	width:900px;
	height:70px;
	margin:0 auto;
}

#menu {
	width:500px;
	margin-top:24px;
	margin-left:10px;
	font-family:NK235,"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	float:left;
}




#home {
	float:left;
	margin-right:20px;
	margin-left:15px;
}
#menu ul a {
	color:#630;
	padding:5px 20px;
}

#menu ul a:hover {
	color:#FFF;
	background:url(images/menuback2.png) repeat-x;
}

#menuwrap li {
	display:inline-block;
}

#menugal {
	width:350px;
	float:right;
	margin-top:30px;
}

#menugal ul a {
	color:#CCC;
	padding:5px 20px;
	letter-spacing:2px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}

#menugal ul a:hover {
	color:#FFF;
	background:url(images/menuback.png) repeat-x bottom left;
}

#menugal p {
	float:left;
	margin-right:20px;
	color:#930;
}

/* SADRZAJ */

#content {
	width:900px;
	height:600px;
	padding:0 50px;
	margin:0 auto 0 auto;
	color:#FFF;
	font-size:12px;
	font-family:"Myriad Pro", "Trebuchet MS", Arial, Helvetica, sans-serif;
	background:url(images/wrap/wrapback_02.png) no-repeat top center;
}

#levo {
	width:550px;
	padding:30px 10px 30px 30px;
	float:left;
}



#desno {
	width:250px;
	padding:10px 0 30px 30px;
	margin-top:20px;
	min-height:400px;
	float:right;
	background:url(images/desnoLinija.png) no-repeat left top;
}

.mreza {
	float:right;
	margin-bottom:10px;
	margin-left:20px;
}

#ikonice {
	background:url(images/ikoniceBack.png) no-repeat right;
	height:60px;
	padding-top:8px;
	padding-right:20px;
	margin-bottom:40px;
}


#fb-root {
	margin-top:50px;
}

h2 {
	font-size:14px;
	margin-bottom:6px;
	margin-right:6px;
	float:right;
}

#facebookBox {
}



/* FOOTER */
#footer {
	width:700px;
	clear:both;
	margin:40px auto 0 auto;
	padding:20px 100px 25px 100px;
	background:url(images/footerlajna.png) no-repeat top center;
	text-align:center;
}

#footer h4 {
	font-size:11px;
	letter-spacing:3px;
	color:#CCC;
	float:left;
}

#footer h5 {
	font-size:11px;
	letter-spacing:2px;
	color:#999;
	float:right;
}


.tekst {
	margin-bottom:10px;
	text-align:justify;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}




/* FOTO */

#foto {
	width:560px;
	padding:10px 10px;
	margin-left:-20px;
	background: rgb(100, 20, 20); /* The Fallback */
    background: rgba(100, 20, 20, 0.4);
	-moz-border-radius-topright:6px;
 	-moz-border-radius-bottomright:6px;
	-webkit-border-top-right-radius:6px;
  	-webkit-border-bottom-right-radius:6px;
	text-align:justify;
}


#foto img {
	width:125px;
	height:125px;
	-moz-border-radius-topright:6px;
	-moz-border-radius-topleft:6px;
 	-moz-border-radius-bottomright:6px;
	-moz-border-radius-bottomleft:6px;
  	-webkit-border-top-left-radius:6px;
	-webkit-border-top-right-radius:6px;
  	-webkit-border-bottom-right-radius:6px;
	-webkit-border-bottom-left-radius:6px;
	margin:5px;
}


#video {
	width:560px;
	padding:15px 10px;
	margin-left:-20px;
	background: rgb(100, 20, 20); /* The Fallback */
    background: rgba(100, 20, 20, 0.4);
	text-align:center;
}





/* KONTAKT */
#kontakt_wrap { 
	width:560px;
	height:400px;
	padding:15px 10px;
	margin-left:-20px;
	background: rgb(100, 20, 20); /* The Fallback */
    background: rgba(100, 20, 20, 0.4);	
}
	
#kontakt {
	width:300px;
	float:left;
	margin-left:10px;
}

#contactForm {
	color:#FFF;
}

li.special {
	display:none;
}

.message {
	color:#EFE2BA;
	display:none;
	margin:-10px 0 0 -30px;
	width:250px;
	padding:15px;
	float:right;
	line-height:15px;
	-moz-border-radius:3ex;
 	-moz-border-radius:3ex;
  	-webkit-border-radius:3ex;
  	-webkit-border-radius:3ex;
}


#contactForm ul {list-style-type:none;width:390px;}

#contactForm li {
	list-style-type:none;
	margin-bottom:15px;
	width:200px;
}

#contactForm li.special {display:none;}

#contactForm input {
	width:203px;
	height:25px;
	padding-left:5px;
	background:#FFF url(images/input.png) no-repeat;
	border:none;
	color:#630;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight:bold;
}


#contactForm #submit {
	width:120px;
	height:35px;
	background:#333 url(images/submit.png) no-repeat 0 -35px;
	text-shadow: 0px -1px 0px #ccc;
	color:#fff;	
	font-weight:bold;
	letter-spacing:1px;
	cursor: pointer;
	margin-top:20px;
}

#contactForm #submit:hover {
	background:#930 url(images/submit.png) no-repeat 0 0;
	color:#523A1B;
	text-shadow: 0px -1px 0px #999;
}

#contactForm textarea {
	padding:7px;
	-moz-border-radius:2ex;
  	-moz-border-radius:2ex;
  	-webkit-border-radius:2ex;
  	-webkit-border-radius:2ex;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#036;
	width:500px;
	max-width:500px;
	margin:0;
}


/* BEND */
#bend {
	width:540px;
	padding:30px 20px 0 20px;
	margin-left:-20px;
	background: rgb(100, 20, 20); /* The Fallback */
    background: rgba(100, 20, 20, 0.4);
	-moz-border-radius-topright:6px;
 	-moz-border-radius-bottomright:6px;
	-webkit-border-top-right-radius:6px;
  	-webkit-border-bottom-right-radius:6px;
	text-align:justify;
}
h3 {
	font-size:20px;
	letter-spacing:1px;
	color:#FFF;
}

h4 {
	font-size:12px;
	color:#CCC;
	margin-bottom:15px;
}

.bend {
	padding-bottom:10px;
	background:url(images/ostalo/bendlinija.png) no-repeat bottom;
	height:170px;
	margin-bottom:30px;

}

.bend img{
	float:left;
	width:150px;
	height:150px;
	margin-right:20px;
	-moz-border-radius:20px;
  	-webkit-border-radius:20px;
	background:url(images/ostalo/bendback.png) no-repeat left;
	padding-left:20px;
	margin-left:-20px;
}

/* TRADICIJA */
#tradicija {
	width:540px;
	padding:80px 20px 20px 20px;
	margin-left:-20px;
	background: rgb(100, 20, 20); /* The Fallback */
    background: rgba(100, 20, 20, 0.4) url(images/ostalo/tradicijaBack1.png) repeat-x top left;
	-moz-border-radius-topright:6px;
 	-moz-border-radius-bottomright:6px;
	-webkit-border-top-right-radius:6px;
  	-webkit-border-bottom-right-radius:6px;
	text-align:justify;
	clear:both;
}

#poslednji {
	padding:0 20px 60px 20px;
	margin:0 -20px -20px -20px;
	background:url(images/ostalo/tradicijaBack2.png) repeat-x bottom left;
}

#podmeni {
	float:right;
	margin-bottom:20px;

}

#podmeni li {
	display:inline-block;
	font-size:18px;
	font-family:Jagodina;
	margin-left:10px;
	padding:3px 15px;
	background:#900;	
}

#podmeni li:hover {
	background:#630;
}






/* HEADER */
#split a {
	width:450px;
	height:250px;
}

a span {
	display:none;
}

#bendH {
	float:left;
	background:url(images/header.jpg) no-repeat 0 0;
}

#bendH:hover {
	background:url(images/header.jpg) no-repeat 0 -250px;
}	

#bendH2 {
	float:left;
	background:url(images/header.jpg) no-repeat 0 -250px;
}

#bendH2:hover {
	background:url(images/header.jpg) no-repeat 0 -250px;
}	



#tradicijaH {
	float:left;
	background:url(images/header.jpg) no-repeat -450px 0;
}

#tradicijaH:hover {
	background:url(images/header.jpg) no-repeat -450px -250px;
}	


#tradicijaH2 {
	float:left;
	background:url(images/header.jpg) no-repeat -450px -250px;
}

#tradicijaH2:hover {
	background:url(images/header.jpg) no-repeat -450px -250px;
}	

p.italic {
	font-family:Georgia, 'Times New Roman', Times, serif;
	font-style:italic;
	line-height:20px;
}





/*PLAYER*/
#FlabellComponent {
	margin-bottom:30px;
	float:right;
}




/* slider */
#slider1 {
   width: 540px; /* important to be same as image width */
   height: 370px; /* important to be same as image height */
   margin:0 auto;
   padding:0;
   position: relative; /* important */
   overflow: hidden; /* important */
}

#slider1Content {
   width: 540px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin: 0; /* important */
   padding:0;
}

.slider1Image {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.slider1Image span strong {
	font-size:1.5em;
	font-weight:bolder;
	color:#FC0;
	margin-bottom:15px;
	padding-top:10px;
}

.slider1Image span {
   position: absolute; /* important */
   left: 0;
   font-size: 12px;
   padding: 10px 13px;
   width: 560px;
   height:50px;
   background-color: #000;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #fff;
   display: none; /* important */
   bottom: 0;
   text-align:left;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}



.clear {
   clear: both;
} 
/* slider end */



