/*---------*/
/* Overlay */
/*---------*/
.simple_overlay {
  
  /* must be initially hidden */
  display:none;
  
  /* place overlay on top of other elements */
  z-index:10000;
  
  /* styling */
  background-color:#333;
  
  width:700px;  
  min-height:200px;
  border:1px solid #666;
  
  /* CSS3 styling for latest browsers */
  -moz-box-shadow:0 0 90px 5px #000;
  -webkit-box-shadow: 0 0 90px #000;  
}

/* close button positioned on upper right corner */
.simple_overlay .close {
  background-image:url(/kalydo_console/images/jquery/tools/close.png);
  position:absolute;
  right:-15px;
  top:-15px;
  cursor:pointer;
  height:35px;
  width:35px;
}

/*---------*/
/* Gallery */
/*---------*/
.next, .prev {
	background:rgba(0, 0, 0, 0.6) url(/kalydo_console/images/jquery/tools/h80.png) repeat-x;
  background:#333 !important;
	
  /* absolute positioning relative to the overlay */
  position:absolute;
  top:40%;  
  border:1px solid #666;  
  cursor:pointer;
  display:block;
  padding:10px 20px;
  color:#fff!important;
  font-size:11px;
  
  /* upcoming CSS3 features */
  -moz-border-radius:5px;
  -webkit-border-radius:5px;  
}

.prev {
  left:0;
  border-left:0;
  -moz-border-radius-topleft:0;
  -moz-border-radius-bottomleft:0;
  -webkit-border-bottom-left-radius:0;
  -webkit-border-top-left-radius:0;
}

.next {
  right:0;
  border-right:0;
  -moz-border-radius-topright:0;
  -moz-border-radius-bottomright:0;
  -webkit-border-bottom-right-radius:0;
  -webkit-border-top-right-radius:0;
	margin-right: 0; 
}

.next:hover, .prev:hover {
  text-decoration:underline;
  background-color:#000;
}

/* when there is no next or previous link available this class is added */
.disabled {
  visibility:hidden;    
}

/* progress indicator (animated gif). should be initially hidden */
.progress {
  position:absolute;
  top:45%;
  left:50%;
  display:none;
}

/*------------*/
/* Scrollable */
/*------------*/
.scrollable {
  /* required settings */
  position:relative;
  overflow:hidden;
  width: 690px;
  height: 275px;
	float: left;
}

/*
  root element for scrollable items. Must be absolutely positioned
  and it should have a extremely large width to accomodate scrollable items.
  it's enough that you set the width and height for the root element and
  not for this element.
*/
.scrollable .items {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
  clear:both;
}

/* single scrollable item */
.scrollable .items > div {
  float:left;
}

/*--------*/
/* Dialog */
/*--------*/
.dialog { 
    background-color:#fff; 
    display:none; 
    width:350px; 
    padding:15px; 
    text-align:left; 
    border:2px solid #333;
 
    opacity:0.8; 
    -moz-border-radius:6px; 
    -webkit-border-radius:6px; 
    -moz-box-shadow: 0 0 50px #ccc; 
    -webkit-box-shadow: 0 0 50px #ccc; 
} 
 
.dialog h2 { 
    background:url(/img/global/info.png) 0 50% no-repeat; 
    margin:0px; 
    padding:10px 0 10px 45px; 
    border-bottom:1px solid #333; 
    font-size:20px; 
}