/*------------------------------------------------------*/
/* =HTML ELEMENTS					*/
/*-----------------------------------------------------*/
body {
	background: #000 url(../images/bg.jpg) no-repeat top center;
	color: #b2b2b2;
	font-family: arial, "helvetica neue", helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
}

a{
	color: #48add7;
	outline: none; /* removing outline in Mozilla */
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

h2, h3 {
	height: 52px;
	padding-bottom: 8px;
	text-indent: -9999px;
}

/*------------------------------------------------------*/
/* =FLOAT CLASSES					*/
/*-----------------------------------------------------*/
.clear {
	clear: both;
	line-height: 0;
}

.floatClear {
	overflow: hidden;
}

/*------------------------------------------------------*/
/* =LAYOUT						*/
/*-----------------------------------------------------*/

/*------------------------------------------------------*/
/* =WRAPPER						*/
#wrapper {
	margin: 0 auto;
	padding-top: 30px;
	width: 950px;
	position: relative;
}

#header {
	background: url(../images/header.jpg) no-repeat;
	height: 372px;
	margin: 0 auto;
	padding-bottom: 10px;
	width: 935px;
}

/*------------------------------------------------------*/
/* =LOGO							*/
#language {
	position: absolute;
	top: 35px;
	right: 20px;
}

#language img {
	padding: 5px;
}

#language img:hover {
	background: url(../images/language-img.png) no-repeat center center;
}

#language a.active img {
	background: url(../images/language-img.png) no-repeat center center;
}

/*------------------------------------------------------*/
/* =MENU							*/
#menu {
	background: url(../images/menu.png) no-repeat;
	height: 38px;
	margin-left: 25px;
	padding-top: 5px;
	width: 576px;
}

#menu  li {
	float: left;
	padding: 0 10px;
}

#menu li.noStyle {
	padding-right: 0;
}

#menu a {
	display: block;
	height: 38px;
	text-indent: -9999px;
	width: 94px;
}

/* menu items */
#menu li.pocetna  a {
	background: url(../images/menu-pocetna.png) no-repeat 0 4px;
}

#menu li.pocetna a:hover {
	background: url(../images/menu-pocetna.png) no-repeat 0 -35px;
}

#menu li.pocetna.active a {
	background: url(../images/menu-pocetna.png) no-repeat 0 -35px;
}

#menu li.usluge  a {
	background: url(../images/menu-usluge.png) no-repeat 0 3px;
	width: 106px;
}

#menu li.usluge a:hover {
	background: url(../images/menu-usluge.png) no-repeat 0 -35px;
}

#menu li.usluge.active  a {
	background: url(../images/menu-usluge.png) no-repeat 0 -35px;
}

#menu li.galerija  a {
	background: url(../images/menu-galerija.png) no-repeat 0 3px;
}

#menu li.galerija  a:hover {
	background: url(../images/menu-galerija.png) no-repeat 0 -35px;
}

#menu li.galerija.active  a {
	background: url(../images/menu-galerija.png) no-repeat 0 -35px;
}

#menu li.oNama  a {
	background: url(../images/menu-o-nama.png) no-repeat 0 3px;
}

#menu li.oNama  a:hover {
	background: url(../images/menu-o-nama.png) no-repeat 0 -35px;
}

#menu li.oNama.active  a {
	background: url(../images/menu-o-nama.png) no-repeat 0 -35px;
}

#menu li.kontakt  a {
	background: url(../images/menu-kontakt.png) no-repeat 0 3px;
}

#menu li.kontakt a:hover {
	background: url(../images/menu-kontakt.png) no-repeat 0 -35px;
}

#menu li.kontakt.active  a {
	background: url(../images/menu-kontakt.png) no-repeat 0 -35px;
}

/*------------------------------------------------------*/
/* =CONTENT						*/
.mainBox {
	background: #262626;
	padding: 5px;
}

.mainBoxTop {
	background: url(../images/main-box-top.png) no-repeat;
	height: 5px;
}

.mainBoxBottom {
	background: url(../images/main-box-bottom.png) no-repeat;
	height: 5px;
	margin-bottom: 15px;
}

img.kontaktImg {
	padding-top: 10px;
}

/* boxes */
.mainBox .box {
	background: #373737;
	padding: 0 5px;
}

/* box holder */
.boxHolder {
	background: url(../images/box-holder-top.jpg) no-repeat top;
	float: left;
	font-size: 11px;
	margin: 0 7px 0 3px;
	padding-top: 5px;
	text-align: center;
	width: 304px;
}

.mainBox .boxHolder .box {
	min-height: 310px;
}

.mainBox .boxHolder .boxBottom {
	margin-bottom: 12px;
}

.boxHolder.last {
	margin-right: 0;
}

.boxHolder p {
	line-height: 20px;
	padding: 0 5px;
	text-align: justify;
}

.boxHolder a {
	text-decoration: underline;
}

.boxHolder a:hover {
	text-decoration: none;
}

.boxHolder img {
	margin-bottom: 5px;
}

.boxHolder  .boxBottom {
	background: url(../images/box-holder-bottom.jpg) no-repeat;
	height: 5px;
}

/* HOME BOXES IMAGES AND HEADERS */
#homeBox1 h2 {
	background: url(../images/h2-home-box1.jpg) no-repeat;
}

#homeBox2 h2 {
	background: url(../images/h2-home-box2.jpg) no-repeat;
}

#homeBox3 h2 {
	background: url(../images/h2-home-box3.jpg) no-repeat;
}

#homeBox4 h2 {
	background: url(../images/h2-home-box4.jpg) no-repeat;
}

#homeBox5 h2 {
	background: url(../images/h2-home-box5.jpg) no-repeat;
}

#homeBox6 h2 {
	background: url(../images/h2-home-box6.jpg) no-repeat;
}

#homeBox1 a,
#homeBox4 a {
	color: #03bc53;
}

#homeBox2 a,
#homeBox5 a {
	color: #f6c591;
}

#homeBox3 a,
#homeBox6 a {
	color: #fff974;
}

/* GALERIJA HOME */
#galerijaHome.box {
	padding: 5px 10px;
}

#galerijaHome h2 {
	background: url(../images/h2-galerija-home.jpg) no-repeat;
}

/* DOBRO DOSLI HOME */
#dobrodosliHome.boxHolder {
	background: url(../images/home-dobrodosli-top.jpg) no-repeat top;
	width: 620px;
}

.mainBox #dobrodosliHome .box {
	padding: 5px 10px;
}

#dobrodosliHome.boxHolder .boxBottom {
	background: url(../images/home-dobrodosli-bottom.jpg) no-repeat bottom;
}

#dobrodosliHome h2 {
	background: url(../images/h2-dobrodosli-home.jpg) no-repeat;
} 

/*------------------------------------------------------*/
/* =INNER PAGES					*/
.boxTop {
	background: url(../images/box-top.jpg) no-repeat;
	height: 6px;
}

.boxBottom {
	background: url(../images/box-bottom.jpg) no-repeat;
	height: 6px;
}

/* USLUGE */
#accordion li {
	background: url(../images/box-bottom.jpg) no-repeat bottom;
	margin-bottom: 10px;
	padding-bottom: 6px;	
	width: 933px;
}

#accordion li a.activator {
	display: block;
	height: 60px;
	width: 100%;
	position: relative;
}

#accordion li a.activator span {
	background: url(../images/activator-span.jpg) no-repeat;
	display: block;
	height: 31px;
	width: 30px;
	position: absolute;
	top: 18px;
	right: 15px;
}

#accordion li a.activator span:hover {
	cursor: default;
}

#accordion li.active a.activator span {
	background: url(../images/activator-span.jpg) no-repeat 0 -33px;	
}

/* each activator img */
#accordion li a.activator.accordion1 {
	background: url(../images/accordion-accordion1.jpg) no-repeat;
}

#accordion li a.activator.accordion2 {
	background: url(../images/accordion-accordion2.jpg) no-repeat;
}

#accordion li a.activator.accordion3 {
	background: url(../images/accordion-accordion3.jpg) no-repeat;
	height: 59px;
}

#accordion li a.activator.accordion4 {
	background: url(../images/accordion-accordion4.jpg) no-repeat;
	height: 58px;
}

#accordion li a.activator.accordion5 {
	background: url(../images/accordion-accordion5.jpg) no-repeat;
}

#accordion li a.activator.accordion6 {
	background: url(../images/accordion-accordion6.jpg) no-repeat;
}

/* accordion inner boxes */
#accordion .box {
	color: #fff;
	overflow: hidden;
}

#accordion h4 {
	font-weight: bold;
}

#accordion li ol {
	padding: 0 0 20px 5px;
}

#accordion li ol li{
	background: url(../images/accordion-box-li.jpg) no-repeat 0 10px;
	color: #fff;
	padding: 3px 0 3px 8px;
	margin: 0;
	width: 100%;
}

#accordion img {
	margin: 8px 0 10px 0;
}

#accordion .left {
	float: left;
	padding: 15px 0 0 15px;
	width: 365px;
}

#accordion .right {
	float: right;
	padding-top: 15px;
	width: 495px;
}

/* accordion1 */
#accordion #accordion1 h4 {
	color: #03bc53;
	padding-left: 10px;
}

#accordion #accordion1 .right ol {
	padding: 0 10px 20px 20px;
}

#accordion #accordion1 p {
	color: #fff;
	padding: 0 10px 15px 10px;
}

#accordion #accordion1 span {
	color: #03bc53;
}

/* accordion2 */
#accordion2 h4,
#accordion2 span {
	color: #f6c591;
	font-weight: bold;
}

#accordion2 h4,
#accordion2 p {
	line-height: 20px;
	margin-bottom: 22px;
}

#accordion2 img {
	margin-bottom: 25px;
}

#accordion2 .floatClear {
	padding-left: 15px;
}

#accordion2 .images {
	float: right;
	padding-left: 10px;
}

#accordion2 .images img {
	display: block;
	margin: 0;
}

#accordion #accordion2 .right ol {
	padding: 0 30px 20px 10px;
}

/* accordion3 */
#accordion3 {
	line-height: 22px;
}

#accordion #accordion3 p {
	color: #fff;
	margin-bottom: 18px;
	padding: 0 10px 5px 10px;
}

#accordion #accordion3 h4 {
	padding: 0 0 10px 5px;
}

#accordion #accordion3 h4, 
#accordion #accordion3 span {
	color: #fff974;
	font-weight: bold;
}

#accordion #accordion3 .left {
	padding-left: 5px;
	width: 420px;
}

#accordion #accordion3 .right {
	width: 442px;
}

/* accordion4 */
#accordion #accordion4 img {
	margin-top: 0;
	position: relative;
	left: -4px;
}

#accordion #accordion4 h4 {
	color: #03bc53;
	margin: 0 0 25px 10px;
}

#accordion4 p {
	margin: 0 0 20px 10px;
}

/* accordion5 */
#accordion5 h4 {
	color: #f6c591;
	font-weight: bold;
	margin-left: 10px;
	padding-top: 15px;
}

#accordion5 .images {
	text-align: center;
}

/* accordion6 */
#accordion6 h4,
#accordion6 span {
	color: #fff974;
	font-weight: bold;
}

#accordion6 img {
	margin-bottom: 25px;
}

#accordion6 .floatClear {
	padding-left: 15px;
}

#accordion6 .images {
	float: right;
	padding-left: 10px;
}

#accordion6 .images img {
	display: block;
	margin: 0;
}

/* GALERIJA */
#galerija h2 {
	background: url(../images/h2-galerija.jpg) no-repeat;
} 

#galerija {
	padding: 0 4px 0 3px;
}

#galerija h4 {
	height: 20px;
	padding: 10px 0;
	text-indent: -9999px;
}

#galerija h4.galleryHeading1 {
	background: url(../images/gallery-heading1.jpg) no-repeat 10px 10px;
} 

#galerija h4.galleryHeading2 {
	background: url(../images/gallery-heading2.jpg) no-repeat 10px 10px;
} 

#galerija h4.galleryHeading3 {
	background: url(../images/gallery-heading3.jpg) no-repeat 10px 10px;
} 

#galerija h4.galleryHeading4 {
	background: url(../images/gallery-heading4.jpg) no-repeat 10px 10px;
} 

#galerija h4.galleryHeading5 {
	background: url(../images/gallery-heading5.jpg) no-repeat 10px 10px;
} 

#galerija h4.galleryHeading6 {
	background: url(../images/gallery-heading6.jpg) no-repeat 10px 10px;
} 


#galerija ul {
	overflow: hidden;
	padding: 5px 0 15px 10px;
}

#galerija ul li {
	float: left;
	padding: 0 20px 10px 3px;
	width: 157px;
}

#galerija ul li.last {
	padding-right: 0;
}

/* O NAMA */
#oNama h2 {
	background: url(../images/h2-o-nama.jpg) no-repeat;
} 

#oNama{
	color: #fff;
	padding: 0 4px 0 3px;
}

#oNama .box {
	overflow: hidden;
}

#oNama img {
	float: left;
	margin: 0 10px 10px 0;
}

#oNama p {
	font-size: 11px;
	line-height: 20px;
	padding: 0 15px 20px 5px;
	text-align: justify;
}

/* KONTAKT */
#kontakt h2 {
	background: url(../images/h2-kontakt.jpg) no-repeat;
} 

#kontakt {
	overflow: hidden;
	padding: 0 4px 0 3px;
}

#kontakt .box {
	overflow: hidden;
}

#kontakt .contactHolder {
	color: #fff;
	float: left;
	font-size: 11px;
	margin: 0 30px 0 5px;
	width: 280px;
}

#kontakt .contactHolder .box {
	background: #555454 url(../images/contact-top.jpg) no-repeat;
	overflow: hidden;
	padding: 4px 5px 5px 5px;
}

#kontakt .contactHolder.last{
	margin-right: 0;
}

#kontakt .contactHolder ul {
	padding-left: 10px;
}

#kontakt .contactHolder ul li {
	padding: 5px 0;
}

#kontakt .contactHolder a {
	color: #fff;
}

#kontakt .contactBottom {
	background: #555454 url(../images/contact-bottom.jpg) no-repeat bottom;	
	height: 4px;
	margin-bottom: 20px;
}

#kontakt #priconInfo {
	color: #fff;
	float: right;
	line-height: 22px;
	text-align: center;
	width: 280px;
}

#kontakt .contactHolder span {
	display: block;
}

#kontakt .contactHolder img {
	float: left;
	margin: 0 15px 0 7px;
}

/* contact boxes titles and styles */
#contactBox1 h3 {
	background: url(../images/h3-contact-box1.jpg) no-repeat;
} 

#contactBox2 h3 {
	background: url(../images/h3-contact-box2.jpg) no-repeat;
} 

#contactBox3 h3 {
	background: url(../images/h3-contact-box3.jpg) no-repeat;
} 

#contactBox4 h3 {
	background: url(../images/h3-contact-box4.jpg) no-repeat;
} 

#contactBox5 h3 {
	background: url(../images/h3-contact-box5.jpg) no-repeat;
} 

#contactBox1 span,
#contactBox4 span {
	color: #0cd261;
}

#contactBox2 span,
#contactBox5 span {
	color: #fff974;
}

#contactBox3 span {
	color: #f6c591;
}

/*------------------------------------------------------*/
/* =FOOTER						*/
#footer {
	color: #fff;
	font-size: 11px;
	margin: 5px auto 0 auto;
	padding: 12px 0;
	text-align: center;
	text-transform: capitalize;
}

#footer a {
	color: #fff;
}

#footer p {
	padding-top: 4px;
}

#footer p a {
	font-weight: bold;
}

#footer ul li {
	border-left: 1px solid #fff;
	display: inline;
	padding: 0 10px;
}

#footer ul li:first-child {
	border-left: none;
}