/* Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */

/*
 * Custom Style Sheet - Use this file to style your content
 */

.icons-container {
background: #d4e0ec; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d4e0ec', endColorstr='#edf6ff'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#d4e0ec), to(#edf6ff)); /* for webkit browsers */
background: -moz-linear-gradient(top,  #d4e0ec,  #edf6ff); /* for firefox 3.6+ */ 
border-radius: 4px;
-moz-border-radius: 4px;
padding: 10px;
width: 185px;
height: 48px;
float: left;
margin-right:10px;
position:relative;
margin-bottom:10px;
margin-top:-5px;
}

.icons-container a{
color:#888;
}

.icons-container a:hover {
color:#004182!important;
}

.icons-container span {
float: left;
margin-left: 60px;
margin-top: 4px;
width: 130px;
}
 
.filesharing-icon a { 
display: block; 
/* width: 48px;  */
height: 48px;
background: transparent url('../images/file_sharing-icon-48.png') no-repeat;
}

.filesharing-icon a:hover { 
background-position: 0 -48px; 
}

.rdpjava-icon a { 
display: block; 
width: 48px; 
height: 48px;
background: transparent url('../images/rdp-java-icon-48.png') no-repeat;
}

.rdpjava-icon a:hover { 
background-position: 0 -48px; 
}

.rdpjava-icon small {
line-height:50%;
}

.rdpweb-icon a { 
display: block; 
width: 48px; 
height: 48px;
background: transparent url('../images/rdp-web-icon-48.png') no-repeat;
}

.rdpweb-icon a:hover { 
background-position: 0 -48px; 
}

.seagull-icon a { 
display: block; 
width: 48px; 
height: 48px;
background: transparent url('../images/seagull-icon-48.png') no-repeat;
}

.seagull-icon a:hover { 
background-position: 0 -48px; 
}

/* ------- */

/*------------------------------------*\
  CHART
\*------------------------------------*/
#chart{
  width:695px;
}
#chart dt{
  width:80px;
  float:left;
  margin:0 0 5px 0;
  padding:2px 0;
  display:inline;
/*font-weight:bold; */
  font-size: 12px;
  text-align:right;
}
#chart dd{
  width:500px;
  border-right:1px solid #ddd;
  float:left;
  margin-bottom:5px;
  display:inline;
}
#chart dd span{
  color:#fff;
  background:#09f;
  text-align:center;
  padding:2px 0;
  display:block;
  text-shadow:1px 1px 1px rgba(0,0,0,0.2);
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
  background:-webkit-gradient(linear, left top, left bottom, from(#668db4), to(#004182));
  -webkit-box-reflect:below 0 -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.25)));
}
#data-one{
  width:92%;
}
#data-two{
  width:89%;
}
#data-three{
  width:15%;
}
#data-one{
  -webkit-animation-name:bar-one; /* Give the bar an animation with a unique name */
}
#data-two{
  -webkit-animation-name:bar-two; /* Give the bar an animation with a unique name */
}
#data-three{
  -webkit-animation-name:bar-three; /* Give the bar an animation with a unique name */
}
#data-one,#data-two,#data-three{ /* Define animation styles for all three
    bars at once */
  -webkit-animation-duration:0.5s; /* Animation duration in seconds */
  -webkit-animation-iteration-count:1; /* Amount of times to loop */
  -webkit-animation-timing-function:ease-out; /* Ease in, out etc. */
}
@-webkit-keyframes bar-one{
  0%{ /* Define bar-one styles at 0% (0 seconds) */
    width:0%;
  }
  100%{ /* Define bar-one styles at 100% (0.5 seconds) */
    width:92%;
  }
}
@-webkit-keyframes bar-two{
  0%{ /* Define bar-two styles at 0% (0 seconds) */
    width:0%;
  }
  100%{ /* Define bar-two styles at 100% (0.5 seconds) */
    width:89%;
  }
}
@-webkit-keyframes bar-three{
  0%{ /* Define bar-three styles at 0% (0 seconds) */
    width:0%;
  }
  100%{ /* Define bar-three styles at 100% (0.5 seconds) */
    width:15%;
  }
}