﻿@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,100italic,300italic,400italic,500italic|Roboto+Condensed:400,400italic,300italic,300&subset=latin,latin-ext);

* {margin:0; padding:0}

A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}

body {
 	margin:0px 0px; padding:0px;
	text-align: center;
/*  background-image: url('../img/gui/bg_body_xmas.png'); */
/*  background-image: url('../img/gui/bg_body.jpg'); */
background-repeat: no-repeat;
background-attachment:fixed;
background-position: center top;
background-size: cover; 
/*background-color: #E5EAEE;*/
background-color: #f0f0f0;
 }
 
div#page_overlayer {
	width: 100%;
	height: 100%;
	position: fixed;
	display: table-block;
	top: 0px;
	left: 0px;
	background: url('../img/gui/overlay.png');
	background: -moz-linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)) repeat-x rgba(255,255,255,0.5);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.5)), to(rgba(255,255,255,0.5))) repeat-x rgba(255,255,255,0.5);
	z-index: 100000;
}


#login_overlay {
	position: relative;
	display: block;
	width: 1024px;
	height: 751px;
	padding: 1px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	top: 5%;
	bottom: 5%;
	background-color: #fff;
	border: 1px solid #245072;
}

#covid_overlay {
	position: relative;
	display: block;
	width: 800px;  /* 1024px;*/
	height: 500px; /* 751px;*/
	padding: 1px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto; margin-bottom: auto;
	top: 10%; bottom: 10%;
	background-color: #fff;
	border: 1px solid #245072;
}

#easter_overlay {
	position: relative;
	display: block;
	width: 736px;
	height: 456px;
	padding: 1px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	top: 10%;
	bottom: 10%;
	background-color: #fff;
	border: 1px solid #245072;
}
 
#xmas_overlay {
	position: relative;
	display: block;
	width: 736px;
	height: 456px;
	padding: 1px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
	top: 20%;
	bottom: 80%;
	background-color: #fff;
	border: 1px solid #245072;
} 

#sticker_overlay {
	position: absolute;
	display: block;
	width: 210px;
	height: 180px;
	float:right;
	margin-left: 70%;
	top: 10%; /*20% */
	z-index: 1001;
	background-image: url('../img/gui/priznanje-2020.png');
}  

.div {
     -moz-box-sizing:border-box;
     box-sizing:border-box;
     -webkit-box-sizing:border-box;
     box-sizing:border-box;
     margin:0px;
     padding:0px;
 }

div#body_container {
display: block;
position: relative;
text-align: left;
width: 100%;
} 
  
div#body
	{ background-color: #E5EAEE; margin: 0px; padding: 0px; }

div#bottom_mirror

	{ width: 895px;  margin-left: auto ;
  margin-right: auto ;	
	
	}

#lang_container {
	position: absolute;
	width: 280px;
	top:52px;
	margin-left:13px;
	/*margin-left: 13px;*/
}

#lang_container2 {
	position: absolute;
	width: 280px;
	top:52px;
	margin-left: 13px;
}

#lang {
	padding: 5px 15px 5px 15px;
	float: right;
	width: 60px;
	border-right: 1px solid #fff;

}
	
div#sadrzaj_content {
width: 875px;
background-color: #245072; 
  margin-left: auto ;
  margin-right: auto ;
}
	
div#anim_layer { position: absolute; width: 369px; height: 246px; z-index: 100; background-repeat: no-repeat; background-image: url('../img/gui/anim_layer.png'); }

div#float_container { position:absolute; width:34px;height:240px;top:0px;right:0px; z-index:100; }

div#obavijest {
width: 434px;
background-color: #245072;
padding:10px;

    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 14px;
   font-style: normal;
   color: #E5EAEE;
   font-weight: normal;
   text-decoration: none;

}

#top_navig {
   position: relative;
   left: 0px;
   width: 895px;
   height: 15px;
   top: 32px;
}

.slideshow_layer {
   position: absolute;
   width: 369px;
   height: 246px;
   z-index: 100;
}

.top_navig_font {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 12px;
   font-style: normal;
   color: #E5EAEE;
   font-weight: normal;
   text-decoration: none;
}

.top_navig_font:hover {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 12px;
   font-style: normal;
   color: #ffffff;
   font-weight: normal;
   text-decoration: none;
}

.top_navig_font2 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 12px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
     line-height: 150%; 
}


.top_navig_lang {
   font-family: 'Roboto', 'Trebuchet MS', sans-serif;
   font-size: 14px;
   font-style: normal;
   color: #c4c4c4;
   background-color:#245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 150%; 
}


.top_navig_lang:hover {
   color: #ffffff;
   font-weight: bold;
   cursor: pointer;
}

.top_navig_lang_act {
   font-family: 'Roboto', 'Trebuchet MS', sans-serif;
   font-size: 14px;
   font-style: normal;
   background-color:#245072;
   text-decoration: none;
   line-height: 150%; 	
   color: #ffffff;
   font-weight: bold;
}


.mmenu {
   vertical-align: bottom;
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 18px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 180%;
}

.mmenu:hover {
   vertical-align: bottom;
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 18px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 180%;
}

.mmenu_active {
   vertical-align: bottom;
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 18px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 180%;
}

.mmenu_sub {
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 15px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 130%;
   }

.mmenu_sub:hover {
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 15px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 130%;
   }

.mmenu_sub2 {
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 13px;
   font-style: normal;
   color: #505050;
   font-weight: normal;
   text-decoration: none;
   line-height: 130%;
   width: 468px;
   }

.mmenu_sub2:hover {
    font-family: 'Roboto Condensed', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 13px;
   font-style: normal;
   color: #505050;
   font-weight: normal;
   text-decoration: none;
   line-height: 130%;
   width: 468px;
   }

.naslov {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 32px;
   font-style: normal;
   color: #ffffff;
   font-weight: normal;
   text-decoration: none;
   line-height: 110%;
}

.naslov2 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 18px;
   font-style: normal;
   color: #245072;
   font-weight: normal;
   text-decoration: none;
   line-height: 110%;
}

.naslov3 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
   font-size: 32px;
   font-style: normal;
   color: #D7D7D7;
   font-weight: normal;
   text-decoration: none;
   line-height: 110%;
}

.top_nav {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 14px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;

}

.left_nav:hover {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 14px;
	color: #004377;
	font-weight: normal;
	text-decoration: none;
	background-color: #dddddd;
	width: 202px;
	height: 24px;
        padding: 4 0 0 0px;
}

.left_nav2 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 12px;
	color: #696969;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.text1 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 14px;
	font-style: normal;
	color: #808080;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

a.text1:hover {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 14px;
	font-style: normal;
	color: #245072;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.text2 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 13px;
	font-style: normal;
	color: #245072;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

a.text2:link {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 13px;
	font-style: normal;
	color: #ffffff;
/*	background-color: #245072;    */
	font-weight: bold;
	text-decoration: none;
	line-height: 160%;
}

.text3 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 13px;
	font-style: normal;
	color: #606060;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

a.text3:hover {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 13px;
	font-style: normal;
	color: #245072;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.text4 {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 12px;
	font-style: normal;
	color: #909090;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.copyright {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 10px;
	font-style: normal;
	color: #245072;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.webmaster {
    font-family: 'Roboto', 'Trebuchet MS', sans-serif;
    font-weight:100;
	font-size: 10px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.ib_date {
	font-family: 'Courier New', Courier, Tahoma, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #245072;
	background: none;
	border: 0px;
	width: 120px;
	height: 15px;
}

.ib_left {
        background-image: url('../img/gui/calendar_gem_left.gif');
	border: 0px none;
	width: 26px;
	height: 19px
}

.ib_right {
        background-image: url('../img/gui/calendar_gem_right.gif');
	border: 0px none;
	width: 26px;
	height: 19px
}

.ib_cal {
	font-family: 'Courier New', Courier, Tahoma, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	font-style: italic;
	color: #606060;
	background: none;
	border: 0px;
	width: 34px;
	height: 28px;
}

.ib_cal_sun {
	font-family: 'Courier New', Courier, Tahoma, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	font-style: italic;
	color: #245072;
	background: none;
	border: 0px;
	width: 34px;
	height: 28px;
}

.blue_bar {
	font-family: 'Roboto', Tahoma, arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
	line-height: 160%;
}

.top10 {
	font-family: 'Roboto', Tahoma, arial, Helvetica, sans-serif;
	font-size: 15px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
	line-height: 160%;
}

.form {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #808080;
	background-color: #f5f5f5;
	background-image: url(../img/gui/form2_bg.gif);	
	border: 1px dotted #afafaf;
	height: 24px;
    width: 346px;
	padding-left: 12px;	
}

.form2 {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #808080;
	background-color: #f5f5f5;
	background-image: url(../img/gui/form2_bg.gif);	
	border: 1px dotted #afafaf;
	height: 24px;
    width: 185px;
	padding-left: 12px;	
}

.form3 {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #808080;
	background-color: #ffffff;
	border: 1px dotted #afafaf;
	height: 24px;
    width: 185px;
	padding-left: 12px;	
}

.form4 {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #808080;
	background-color: #ffffff;
	border: 1px dotted #afafaf;
	height: 24px;
    width: 436px;
	padding-left: 12px;	
}


.form_validator {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #245072;
	background-color: #f5f5f5;
	background-image: url(../img/gui/form2_bg.gif);	
	border: 1px dotted #afafaf;
	height: 24px;
    width: 80px;
	padding-left: 12px;		
}

#form_validator_code { height: 24px; width: 87px; position: absolute; }

.form_box {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #808080;
	background-color: #f5f5f5;
	background-image: url(../img/gui/form2_bg.gif);	
	border: 1px dotted #afafaf;
	height: 155px;
    width: 436px;
	padding-left: 12px;
	scrollbar-face-color: #ffffff;
	scrollbar-shadow-color: #afafaf;
    scrollbar-highlight-color: #afafaf;
	scrollbar-3dlight-color: #ffffff;
	scrollbar-darkshadow-color: #ffffff;
	scrollbar-track-color: #ffffff;
    scrollbar-arrow-color: #afafaf;
}

.form_send {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #004377;
	background-color: #FFFFFF;
	background-image: url(../img/gui/gem_send.png);
	width: 88px;
	height: 18px;
	border: 0px;
	cursor: hand;
}

.form_reset {
	font-family: 'Roboto', 'Segoe UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #004377;
	background-color: #FFFFFF;
	background-image: url(../img/gui/form_reset.gif);
	width: 80px;
	height: 20px;
	border: 0px;
	cursor: hand;
}

.webmap1 {
	font-family: 'Roboto', 'Segoa UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
	line-height: 100%;
}

.webmap2 {
	font-family: 'Roboto', 'Segoa UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #B2C1CD;
	font-weight: normal;
	text-decoration: none;
	line-height: 180%;
}

a.webmap2:hover {
	font-family: 'Roboto', 'Segoa UI', 'Trebuchet MS', arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	color: #ffffff;
	font-weight: normal;
	text-decoration: none;
	line-height: 180%;
}

.ddpanel .ddpanelcontent{ /*CSS for "content" DIV of Drop Down Panel*/
color: #ffffff;
/*background: #fff; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
}

.ddpanel .ddpaneltab{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
margin-right: 0px;
font: normal 12px Arial;
}

.ddpanel .ddpaneltab a{ /*"toggle" tab related CSS*/
float: right;
color: white;
background-color: #fff; /*background of toggle tab*/
text-decoration: none;
letter-spacing: 1px;
}

.ddpanel .ddpaneltab a span{ /*"toggle" tab related CSS*/
float: left;
display: block;
background: transparent;
padding: 1px 12px 4px 13px;
cursor: pointer;
}

.ddpanel .ddpaneltab a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel .ddpaneltab a:hover{ /*"toggle" tab related CSS*/
background-color: #004377; /*background of toggle tab onMouseover*/
}

.ddpanel .ddpaneltab a:active, .ddpanel .ddpaneltab a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}

.ddpanel .ddpaneltab a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}

#tema1     	{position: absolute; z-index: 2; width:450px; visibility: hidden;}
#tema2     	{position: absolute; z-index: 2; width:450px; visibility: hidden;}
#tema3     	{position: absolute; z-index: 2; width:450px; visibility: hidden;}
#tema4     	{position: absolute; z-index: 2; width:450px; visibility: hidden;}
#tema5     	{position: absolute; z-index: 2; width:450px; visibility: hidden;}
#tema6          {position: absolute; z-index: 2; width:450px; visibility: hidden;}
#moreinfo     	{position: absolute; z-index: 1; width:471px; height:30px; }

#mmenu                 {cursor: hand; position: absolute; z-index: 101; width:486px; height:75px; top:356px; visibility: visible;}
#mmenu_djelatnosti     {cursor: hand;position: absolute; z-index: 101; width:486px; top:431px; visibility: hidden;}
#mmenu_osoblje         {cursor: hand;position: absolute; z-index: 101; width:486px; top:431px; visibility: hidden;}
#mmenu_oprema          {cursor: hand;position: absolute; z-index: 101; width:486px; top:431px; visibility: hidden;}
#mmenu_edukacija       {cursor: hand;position: absolute; z-index: 101; width:486px; top:431px; visibility: hidden;}
#mmenu_kontakt         {cursor: hand;position: absolute; z-index: 101; width:486px; top:431px; visibility: hidden;}

div#cestitka_container {
  position: absolute;
  display: block;
  left: 50%; margin-left: -418px; top: 60px;
	width:895px;
	z-index: 1000;
	text-align: left;
}

div#cestitka {
  position: relative;
  display: block;
  padding-left: 470px;
  z-index: 1;
  visibility: visible;
}

/* zoomer */
/* Colorbox Core Style: */
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* User Style: */
#cboxOverlay{background:url(../img/gui/zoom/overlay.png) repeat 0 0;}
#colorbox{outline:0;}
    #cboxTopLeft{width:21px; height:21px; background:url(../img/gui/zoom/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(../img/gui/zoom/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(../img/gui/zoom/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(../img/gui/zoom/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(../img/gui/zoom/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(../img/gui/zoom/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(../img/gui/zoom/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(../img/gui/zoom/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; font-family: 'Roboto Condensed', sans-serif; font-weight:400; font-size: 22px; line-height: 20px; color: #2A5576; }
        #cboxCurrent{position:absolute; bottom:2px; font-weight:300; font-family: 'Roboto Condensed', sans-serif; font-size: 15px; left:58px; color:#808080;}
        #cboxLoadingOverlay{background:url(../img/gui/zoom/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(../img/gui/zoom/loader.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(../img/gui/zoom/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../img/gui/zoom/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(../img/gui/zoom/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}